怎么实现CSS横排图片并列2-4张

html-css011

怎么实现CSS横排图片并列2-4张,第1张

最常用的一种方法:就是浮动,浮动之后会自动往右挤,挤不下就到第二行了。  

     <ul>

           <li>第一张图片</li>

           <li>第二张图片</li>

           <li>第三张图片</li>

           <li>第四张图片</li>

           <li>第五张图片</li>

           <li>第六张图片</li>

           <li>第七张图片</li>

           <li>第八张图片</li>

    </ul>

<style> ul{width:800px height:200px} li{width:195pxheight:98pxmargin:1px auto float:leftlist-style-type:none}

</style>

有个办法是写8个div标记对,中间加img插入图片,然后设置float:left。第2、4、6个div设置css属性clear:right,这样就能够实现自动浮动成每2张图片为一排,后面的图片自动对齐的效果了