偽類選擇符:nth-child()實現彩色標籤雲(顯示效果，點下面的執行按鈕)，原始碼如下：

<style><!-- .tag-list{width: 300px;list-style: none;margin: 50px;padding: 20px;} .tag-list a{line-height: 20px;float: left;margin: 5px 5px 5px 12px;padding: 0 18px;color: #fff;text-decoration: none;background-color: #666;position: relative;border-radius: 0 1px 1px 0;} .tag-list a::before{display: block;content:"";position: absolute;left: -20px;top: 0px;width: 0;height: 0;border: 10px transparent dashed;} .tag-list a::before{border-left-style: solid;border-right-color: #666;} .tag-list a:nth-child(6n+1){background-color: #ff002b;} .tag-list a:nth-child(6n+2){background-color: #ffa900;} .tag-list a:nth-child(6n+3){background-color: #00a753;} .tag-list a:nth-child(6n+4){background-color: #b433ff;} .tag-list a:nth-child(6n+5){background-color: #b37333;} .tag-list a:nth-child(6n+1)::before{border-right-color: #ff002b;} .tag-list a:nth-child(6n+2)::before{border-right-color: #ffa900;} .tag-list a:nth-child(6n+3)::before{border-right-color: #00a753;} .tag-list a:nth-child(6n+4)::before{border-right-color: #b433ff;} .tag-list a:nth-child(6n+5)::before{border-right-color: #b37333;} --></style> <div class="tag-list"> <h3>標籤雲</h3> <p><a href="#">1</a><a href="#">2</a><a href="#">3</a><a href="#">4</a><a href="#">5</a><a href="#">06</a><a href="#">07</a><a href="#">08</a><a href="#">09</a><a href="#">10</a><a href="#">011</a><a href="#">012</a><a href="#">013</a><a href="#">014</a><a href="#">015</a><a href="#">016</a><a href="#">017</a><a href="#">018</a><a href="#">019</a><a href="#">020</a></p> </div>

提示：你可以先修改部分程式碼再執行。

可以看到上述原始碼實現了一個由6種顏色組合迴圈顯示的彩色標籤雲，主要是運用css3新增的偽類選擇符:nth-child()實現的，這裡該選擇符使用的乘法因子(......