子比主题美化教程(备忘录)

子比主题美化教程(备忘录)

前言

本文章只是个人无聊时的对子比主题美化记录集合,同时也是本人的备忘录。若您觉得可以的话就拿去贵站使用吧,我会不定期(主要是想不到好的美化了)更新一些美化教程、好玩的小工具、页面等等。

美化说明:

美化教程(集合)

说明:(重要)

一些老教程随机顺序,新教程排在最后,越往后越新。
↓↓↓↓↓↓↓↓↓↓不会添加代码的看下面↓↓↓↓↓↓↓↓↓

↑↑↑↑↑↑↑↑↑↑↑不会添加代码的看上面↑↑↑↑↑↑↑↑↑↑
其他添加方式的,我会在教程里告知,若只需添加CSS+JS的教程,我可能不重复告知了,请注意看上面的方法。
有些美化教程本站已经发布的,本文章将不再进行编写教程,直接跳转到文章页面。

前言

文章标签美化采用的是CSS覆盖原来的样式,达到彩色的效果!直接在后台主题自定义CSS样式粘贴CSS代码,这样升级主题时无需二次复制粘贴,简单、实用。

食用教程

复制CSS代码到后台子比主题设置—》自定义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}
  • 注:CSS代码已进行压缩,直接复制粘贴即可。

效果截图

图片[2]-子比主题美化教程(备忘录)-梦境学习站
网站点击彩色效果-梦境学习站
网站点击彩色效果-梦境学习站
小梦同学的头像-梦境学习站钻石会员小梦同学
24708
  • CSS代码:
/点击更多/
.theme-pagination .ajax-next a, .theme-pagination .order-ajax-next a{border-radius: 30px; padding: 15px 0; color: var(--muted-color); background-color:var(--main-bg-color);color: #FF0033;display: block;opacity: 1;font-weight:bold;}

1 2 3 4 5

------本页内容已结束,喜欢请分享------

感谢您的来访,获取更多精彩文章请收藏本站。

© 版权声明
THE END
喜欢就支持一下吧
点赞13 分享
评论 共1条
头像
欢迎您留下宝贵的见解!
提交
头像

昵称

取消
昵称表情代码图片