WordPress标签美化,RiPro彩色标签CSS代码

WordPress标签美化,RiPro彩色标签CSS代码

  • 正文概述
  • RiPro主题标签美化,彩色标签CSS代码,适用所有WordPress主题。

    RiPro主题使用教程

    将CSS代码复制到div.css文件中,保存后清除浏览器缓存,刷新浏览器即可。

    如果非RiPro主题,需修改代码的类名,比如删除.widget_tag_cloud

    /*
    ** 主题兽
    ** www.zhutishou.com
    */
    .widget_tag_cloud .tagcloud>a{
    	margin: 0 8px 8px 0;
    	box-shadow: 0px 0px 2px 0 rgba(14, 14, 14);
        -o-box-shadow: 0px 0px 2px 0 rgba(14, 14, 14);
        -ms-box-shadow: 0px 0px 2px 0 rgba(14, 14, 14);
        -moz-box-shadow: 0px 0px 2px 0 rgba(14, 14, 14);
        -webkit-box-shadow: 0px 0px 2px 0 rgba(14, 14, 14);
    }
    
    .ripro-dark .widget_tag_cloud .tagcloud>a{
    	box-shadow: 0px 0px 2px 0 rgba(255, 255, 255);
        -o-box-shadow: 0px 0px 2px 0 rgba(255, 255, 255);
        -ms-box-shadow: 0px 0px 2px 0 rgba(255, 255, 255);
        -moz-box-shadow: 0px 0px 2px 0 rgba(255, 255, 255);
        -webkit-box-shadow: 0px 0px 2px 0 rgba(255, 255, 255);
    }
    
    .widget_tag_cloud .tagcloud>a:nth-child(10n+1){
    	background-color: rgba(244, 67, 54, 0.2);
        color: #F44336;
    }
    .widget_tag_cloud .tagcloud>a:nth-child(10n+2){
    	background-color: rgba(156, 39, 176, 0.2);
        color: #9C27B0;
    }
    .widget_tag_cloud .tagcloud>a:nth-child(10n+3){
    	background-color: rgba(63, 81, 181, 0.2);
        color: #3F51B5;
    }
    .widget_tag_cloud .tagcloud>a:nth-child(10n+4){
    	background-color: rgba(3, 169, 244, 0.2);
        color: #2196F3;
    }
    .widget_tag_cloud .tagcloud>a:nth-child(10n+5){
    	background-color: rgba(76, 175, 80, 0.2);
        color: #4CAF50;
    }
    .widget_tag_cloud .tagcloud>a:nth-child(10n+6){
    	background-color: rgba(255, 152, 0, 0.2);
        color: #FF9800;
    }
    .widget_tag_cloud .tagcloud>a:nth-child(10n+7){
    	background-color: rgba(121, 85, 72, 0.2);
        color: #795548;
    }
    .widget_tag_cloud .tagcloud>a:nth-child(10n+8){
    	background-color: rgba(255, 106, 0, 0.2);
        color: #ff6a00;
    }
    .widget_tag_cloud .tagcloud>a:nth-child(10n+9){
    	background-color: rgba(47, 73, 253, 0.2);
        color: #2f49fd;
    }
    .widget_tag_cloud .tagcloud>a:nth-child(10n+10){
    	background-color: rgba(96, 125, 139, 0.2);
        color: #607d8b;
    }
     
    .widget_tag_cloud .tagcloud>a:nth-child(10n+1):hover {
    	background-color: rgba(244, 67, 54);
    	color: #ffffff;
    }
    .widget_tag_cloud .tagcloud>a:nth-child(10n+2):hover {
    	background-color: rgba(156, 39, 176);
    	color: #ffffff;
    }
    .widget_tag_cloud .tagcloud>a:nth-child(10n+3):hover {
    	background-color: rgba(63, 81, 181);
    	color: #ffffff;
    }
    .widget_tag_cloud .tagcloud>a:nth-child(10n+4):hover {
    	background-color: rgba(3, 169, 244);
    	color: #ffffff;
    }
    .widget_tag_cloud .tagcloud>a:nth-child(10n+5):hover {
    	background-color: rgba(76, 175, 80);
    	color: #ffffff;
    }
    .widget_tag_cloud .tagcloud>a:nth-child(10n+6):hover {
    	background-color: rgba(255, 152, 0);
    	color: #ffffff;
    }
    .widget_tag_cloud .tagcloud>a:nth-child(10n+7):hover {
    	background-color: rgba(121, 85, 72);
    	color: #ffffff;
    }
    .widget_tag_cloud .tagcloud>a:nth-child(10n+8):hover {
    	background-color: rgba(255, 106, 0);
        color: #ffffff;
    }
    .widget_tag_cloud .tagcloud>a:nth-child(10n+9):hover {
    	background-color: rgba(47, 73, 253);
        color: #ffffff;
    }
    .widget_tag_cloud .tagcloud>a:nth-child(10n+10):hover {
    	background-color: rgba(96, 125, 139);
        color: #ffffff;
    }
    纯净子主题,干净整洁,独立后台,集成自助广告系统。
    主题兽 » WordPress标签美化,RiPro彩色标签CSS代码

    2 评论

    1. 请问站长用的是什么代码高亮插件呢?

      1. pure-highlightjs修改版,我是直接集成到子主题,修改后的插件版找不着了

    发表评论