http://codepen.io/Thisisntme/pen/rVRyJE是对我网站的测试.我试图添加一个flickity轮播,由于某种原因它不会渲染div中的第二个图像.这是没有所有其他html和CSS的东西的旋转木马. http://codepen.io/Thisisntme/pen/waOeWa
CSS：
* {
-webkit-Box-sizing: border-Box;
Box-sizing: border-Box;
}
.gallery {
padding: 50px 0px 0px 0px;
}
.gallery img {
display: block;
width: 100%;
height:auto;
}
继承人证明图像链接很好
哦,没有jQuery.
编辑：对于那些仍然关心的人,图像不再起作用了. Google云端硬盘停止让您从他们的服务器托管.
最佳答案
你的.gallery-cell只需要100％的宽度,至少对我来说,你的img标签需要明确关闭.为了解决大小调整问题,我使用JS显式初始化了Flickity,而不是隐式使用HTML类.
JSFiddle：https://jsfiddle.net/3qr6hub1/2/
var flkty = new Flickity('.gallery');
* {
-webkit-Box-sizing: border-Box;
Box-sizing: border-Box;
}
.gallery {
padding: 50px 0px 0px 0px;
}
.gallery-cell {
width: 100%;
}
.gallery img {
width: 100%;
}
原文链接：https://www.f2er.com/html/426168.html