Zibll子比主题设置自定义彩色标签图文教程-搬主题

AI 智能摘要

不过效果比较一般，毕竟都是没有颜色的，这里搬主题发现有些不错的效果可以让文章后面的标签变成彩色标签，效果还不错。这里搬主题就分享一下Zibll子比主题设置自定义彩色标签图文教程给大家。

大家知道Zibll子比主题的文章后面可以会自动显示一些标签，不过效果比较一般，毕竟都是没有颜色的，这里搬主题发现有些不错的效果可以让文章后面的标签变成彩色标签，效果还不错。这里搬主题就分享一下Zibll子比主题设置自定义彩色标签图文教程给大家。

文章标签原先无颜色设置为彩色的。如下图

本次美化采用css代码美化，只需要复制粘贴到子比主题后台自定义css样式即可

美化效果如下

css代码如下

/*文章彩色标签随机*/
.article-tags{margin-bottom: 10px}.article-tags a{padding: 4px 10px;background-color: #19B5FE;color: white;font-size: 12px;line-height: 16px;font-weight: 400;margin: 0 5px 5px 0;border-radius: 2px;display: inline-block}
.article-tags a:nth-child(5n){background-color: #4A4A4A;color: #FFF}
.article-tags a:nth-child(5n+1){background-color: #ff5e5c;color: #FFF}
.article-tags a:nth-child(5n+2){background-color: #ffbb50;color: #FFF}
.article-tags a:nth-child(5n+3){background-color: #1ac756;color: #FFF}
.article-tags a:nth-child(5n+4){background-color: #19B5FE;color: #FFF}
.article-tags a:hover{background-color: #1B1B1B;color: #FFF}

直接放到主题的自定义代码

如需要一些其他的颜色代码可以进行更改如下的类似代码

更多颜色可以参考如下颜色代码

颜色 (Color)	颜色十六进制 (Color HEX)	颜色RGB (Color RGB)
黑色 (Black)	#000000	rgb(0,0,0)
红色 (Red)	#FF0000	rgb(255,0,0)
绿色 (Green)	#00FF00	rgb(0,255,0)
蓝色 (Blue)	#0000FF	rgb(0,0,255)
黄色 (Yellow)	#FFFF00	rgb(255,255,0)
青色 (Cyan)	#00FFFF	rgb(0,255,255)
品红色 (Magenta)	#FF00FF	rgb(255,0,255)
银色 (Silver)	#C0C0C0	rgb(192,192,192)
白色 (White)	#FFFFFF	rgb(255,255,255)
灰色 (Gray)	#808080	rgb(128,128,128)
橙色 (Orange)	#FFA500	rgb(255,165,0)
紫色 (Purple)	#800080	rgb(128,0,128)
深绿色 (Dark Green)	#008000	rgb(0,128,0)
青色 (Teal)	#008080	rgb(0,128,128)
橄榄色 (Olive)	#808000	rgb(128,128,0)
栗色 (Maroon)	#800000	rgb(128,0,0)
深蓝色 (Navy)	#000080	rgb(0,0,128)

① 本站文章均为原创，除非另有说明，否则本站内容依据CC BY-NC-SA 4.0许可证进行授权，转载请附上出处链接，谢谢。
② 本站提供的资源(插件或主题)均为网上搜集，如有涉及或侵害到您的版权请立即通知我们。
③ 本站所有下载文件，仅用作学习研究使用，请下载后24小时内删除，支持正版，勿用作商业用途。
④ 因代码可变性，不保证兼容所有浏览器、不保证兼容所有版本的WP、不保证兼容您安装的其他插件。
⑤ 本站保证所提供资源(插件或主题)的完整性，但不含授权许可、帮助文档、XML文件、PSD、后续升级等。
⑥ 使用该资源(插件或主题)需要用户有一定代码基础知识！另本站提供汉化使用安装教程，仅供参考。由本站提供的资源对您的网站或计算机造成严重后果的本站概不负责。
⑦ 有时可能会遇到部分字段无法汉化，同时请保留作者汉化宣传信息，谢谢！
⑧ 本站资源售价只是赞助和汉化辛苦费，收取费用仅维持本站的日常运营所需。
⑨ 如果喜欢本站资源，欢迎捐助本站开通会员享受优惠折扣，谢谢支持！
⑩ 如果网盘地址失效，请在相应资源页面下留言，我们会尽快修复下载地址。

THE END