这个图中灰色块两端对齐，我现在用nth-child(3n)设置margin-right:0可以对齐

 

 

代码：

 

 

<div class="banner"></div>

<div class="box">

    <ul>

        <li></li>

        <li></li>

        <li></li>

        <li></li>

        <li></li>

        <li></li>

        <li></li>

        <li></li>

    </ul>

</div>

 

 

CSS

 

 

*{margin: 0;padding: 0;}

.banner{width:1000px;height: 200px;background: #f00;margin: 0 auto;}

.box{width:1000px;margin: 0 auto;}

 

ul{overflow: hidden;}

li{

    float: left;

    width:320px;

    height: 200px;

    background: #ccc;

    list-style: none;

    margin-right: 20px;

    margin-bottom: 20px;

}

li:nth-child(3n){

    margin-right: 0;

}