nth-child 2

by Tien Tran

HTML

<div class="category-bound">
 <ul>
     <li><a href="trang-chu.html">Trang chủ</a></li>
        <li><a href="tin-tuc/xa-hoi.html">Xã hội</a></li>
        <li><a href="tin-tuc/doi-song.html">Đời sống</a></li>
        <li><a href="tin-tuc/giao-duc.html">Giáo dục</a></li>
        <li><a href="tin-tuc/suc-khoe.html">Sức khỏe</a></li>
        <li><a href="tin-tuc/giai-tri.html">Giải trí</a></li>
        <li><a href="tin-tuc/cong-nghe.html">Công nghệ</a></li>
        <li><a href="lien-he.html">Liên hệ</a></li>
    </ul>
</div>

CSS

.category-bound ul li{
    display:inline-block;
    margin:5px;
}
.category-bound ul li a{
    text-decoration:none;
    color:#fff;
    padding:0 10px;
}
.category-bound ul li{background:#f00;}
.category-bound ul li:nth-child(4n+2){background:#FFBF00;}
.category-bound ul li:nth-child(4n+3){background:#FF8601;}
.category-bound ul li:nth-child(4n+4){background:#B3D52C;}