WordPress美化:利用简单的CSS样式即可实现WordPress文章尾部彩色标签

WordPress美化:利用简单的CSS样式即可实现WordPress文章尾部彩色标签
我们是否有看到有些WordPress站点的标签不单调，而是彩色的标签显示，那这个是如何显示的呢？当然有些是主题实现的自定义颜色，这里如果我们需要快速实现标签彩色展示也是可以的，这里我们直接用样式调用。当然，这个只适合系统自带的wp_tag_cloud函数实现的，如果自定义的，将tags这个ID替换为当前主题的ID,本站使用的是article-tags。
将下面的CSS代码添加到我们当前主题的CSS中

.tags{}
.tags a:nth-child(12n){background-color: #4A4A4A;}
.tags a:nth-child(12n+1){background-color: #428BCA;}
.tags a:nth-child(12n+2){background-color: #5CB85C;}
.tags a:nth-child(12n+3){background-color: #D9534F;}
.tags a:nth-child(12n+4){background-color: #567E95;}
.tags a:nth-child(12n+5){background-color: #FEC42D;}
.tags a:nth-child(12n+6){background-color: #B433FF;}
.tags a:nth-child(12n+7){background-color: #6E8B3D;}
.tags a:nth-child(12n+8){background-color: #00ABA9;}
.tags a:nth-child(12n+9){background-color: #969696;}
.tags a:nth-child(12n+10){background-color: #B37333;}
.tags a:nth-child(12n+11){background-color: #FF6600;}
.tags a{opacity: 0.80;filter:alpha(opacity=80);color: #fff;font-size: 14px;background-color: #428BCA;display: inline-block;margin: 0 5px 4px 0;padding: 3px 6px;border-radius: 2px;}
.tags a:hover{opacity: 1;filter:alpha(opacity=100); color: #fff;}