在线观看不卡亚洲电影_亚洲妓女99综合网_91青青青亚洲娱乐在线观看_日韩无码高清综合久久

鍍金池/ 問答/HTML5  Java  HTML/ 如何給每個li標簽設置不同的顏色

如何給每個li標簽設置不同的顏色

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
</head>
<body>
    <div class="logo">
        <ul>
            <li>123123</li>
            <li>2312312</li>
            <li>sjfsdf</li>
            <li>sdfsdaf</li>
            <li>sdfagag</li>
            <li>sdfafsf</li>
            <li>sdafafasdf</li>
            <li>sdafafasdf</li>
            <li>sdafafasdf</li>
            <li>sdafafasdf</li>
            <li>sdafafasdf</li>
            <li>sdafafasdf</li>
            <li>sdafafasdf</li>
            <li>sdafafasdf</li>
            <li>sdafafasdf</li>
            <li>sdafafasdf</li>
            <li>sdafafasdf</li>
            <li>sdafafasdf</li>
            <li>sdafafasdf</li>
            <li>sdafafasdf</li>
            <li>sdafafasdf</li>
            <li>sdafafasdf</li>
            <li>sdafafasdf</li>
            <li>sdafafasdf</li>
            <li>sdafafasdf</li>
        </ul>
    </div>
</body>
</html>

總共4個顏色
第一個li是紅色
第二個li是藍色
第三個li是黑色
第四個li是黃色

第5-8li再重復上面的顏色 以此類推
純css 能實現(xiàn)嗎? 有沒有好一點的寫法

回答
編輯回答
雨蝶

能實現(xiàn)啊, :nth-child(4n) 這種css選擇器了解一下

2018年7月31日 05:04
編輯回答
孤星
ul:li:nth-child(4n+1){
    color: red;
}
ul:li:nth-child(4n+2){
    color: blue;
}
ul:li:nth-child(4n+3){
    color: black;
}
ul:li:nth-child(4n){
    color: yellow;
}
希望能幫助到您,歡迎關注我的微信公眾號:前端指南
2017年6月29日 19:25