这是 4 个图像(宽度 = 160 像素)的流畅设计,带有 ul 或浮动 div。调整窗口大小时一切都很好。它是流动的。
但是当我传递到一个绝对位置时,我最初发现没有 160px
代码:
身体 { 位置:相对;} .container { /位置:绝对;左:0;顶部:0;/ /* 删除这条注释以查看差异 */ margin: 0; 填充:0;边框:黑色 1px 实心;最大宽度:690px;溢出:隐藏/清除浮动孩子/;} .galleryItem {浮动:左;宽度:23%;保证金:0 1%;padding:1% 0;} .galleryItem img { max-width: 100%;} ul { list-style:none;} ul.thumbs
{ / position:absolute; 左:0;顶部:100px;/ /* 去掉这个注释看看有什么不同 */ display:block; 边距:0;填充:0;边框:黑色 1px 实心;最大宽度:690px;溢出:隐藏/清除浮动孩子/;} ul.thumbs>li{ display:block; 向左飘浮; 宽度:23%;保证金:0 1%;padding:1% 0;} ul.thumbs>li img{ display:block; 最大宽度:100%;}