效果:

CSS代碼:
.tagslist li {
display: inline-block;
}
.tagslist li:nth-child(8n-7) a {
background-color: #8A9B0F;
}
.tagslist li:nth-child(8n-6) a {
background-color: #EB6841;
}
.tagslist li:nth-child(8n-5) a {
background-color: #3FB8AF;
}
.tagslist li:nth-child(8n-4) a {
background-color: #FE4365;
}
.tagslist li:nth-child(8n-3) a {
background-color: #FC9D9A;
}
.tagslist li:nth-child(8n-2) a {
background-color: #EDC951;
}
.tagslist li:nth-child(8n-1) a {
background-color: #C8C8A9;
}
.tagslist li:nth-child(8n) a {
background-color: #83AF9B;
}
.tagslist li:first-child a {
background-color: #036564;
}
.tagslist li:last-child a {
background-color: #3299BB;
}
.tagslist a {
display: block;
color: #fff;
padding: 5px 8px;
border-radius: 5px;
font-size: 14px;
margin:5px;
}
.tagslist li:hover a{opacity: 0.8;}
模板index_tags.htm(沒有自已增加一個)代碼:
<ul class="tagslist">
{eyou:tag sort='now' getall='0' row='500'}
<li><a target="_blank" href="{$field.link}">{$field.tag}</a></li>
{/eyou:tag}
</ul>
當然也可以隨時放到別的位置,更高級用法查http://www.xiuhaier.com/doc/label/中的tags標簽調用