.fl-pic{ overflow:hidden; width:750px; //可见元素的宽度 height:50px; } .fl-pic ul{ width:3500px;//让LI能够在一行,如果小了,LI会换行; } .fl-pic ul li{ float:left; width:100px; height:50px; } <div class="fl-pic"> <ul> <li><img src="images/fr-logo-01.gif" alt="" /></li> <li><img src="images/fr-logo-02.gif" alt="" /></li> <li><img src="images/fr-logo-03.gif" alt="" /></li> <li><img src="images/fr-logo-04.gif" alt="" /></li> <li><img src="images/fr-logo-05.gif" alt="" /></li> <li><img src="images/fr-logo-06.gif" alt="" /></li> <li><img src="images/fr-logo-02.gif" alt="" /></li> <li><img src="images/fr-logo-03.gif" alt="" /></li> </ul> </div>
本文深入探讨了使用CSS实现图片轮播的浮动布局技巧,详细解释了如何通过设置div、ul和li的样式来确保多个图片在一排显示,并保持良好的页面布局效果。
932

被折叠的 条评论
为什么被折叠?



