zblog模板制作中，特別是博客、CMS模板經(jīng)常用到上圖所示的CSS，代碼主要為ul li結(jié)構(gòu)！
下面分享下這塊兒的CSS代碼：
//首先是上圖HTML代碼 <div class="com-title"><span>標(biāo)簽列表</span></div> <ul class="ul_divTags_inner"><li><a target="_blank" href="http://theme.b5b6.com/ydlinux/tags-14.html">推薦</a></li><li><a target="_blank" href="http://theme.b5b6.com/ydlinux/tags-5.html">Ubuntu</a></li><li><a target="_blank" href="http://theme.b5b6.com/ydlinux/tags-1.html">硬件</a></li><li><a target="_blank" href="http://theme.b5b6.com/ydlinux/tags-2.html">Google</a></li><li><a target="_blank" href="http://theme.b5b6.com/ydlinux/tags-3.html">Android</a></li><li><a target="_blank" href="http://theme.b5b6.com/ydlinux/tags-4.html">Linux</a></li><li><a target="_blank" href="http://theme.b5b6.com/ydlinux/tags-6.html">CentOS</a></li><li><a target="_blank" href="http://theme.b5b6.com/ydlinux/tags-7.html">AMD</a></li><li><a target="_blank" href="http://theme.b5b6.com/ydlinux/tags-8.html">AlphaGo</a></li><li><a target="_blank" href="http://theme.b5b6.com/ydlinux/tags-9.html">PS4</a></li><li><a target="_blank" href="http://theme.b5b6.com/ydlinux/tags-10.html">系統(tǒng)</a></li><li><a target="_blank" href="http://theme.b5b6.com/ydlinux/tags-11.html">linux</a></li><li><a target="_blank" href="http://theme.b5b6.com/ydlinux/tags-12.html">Webassembly</a></li><li><a target="_blank" href="http://theme.b5b6.com/ydlinux/tags-13.html">瀏覽器</a></li></ul>
然后是CSS：
.ul_divTags_inner li{float: left; margin-right: 6px;line-height: 38px; font-size: 16px;}
.ul_divTags_inner li a{color: #ffffff; background-color: #00AA98; padding: 5px 6px;}
.ul_divTags_inner li a:hover{background-color: #414141;}如果嫌HTML太亂，可以復(fù)制到編輯工具里進(jìn)行整理下格式，這樣就一目了然了。