折翼天使资源社区

 找回密码
 立即注册

QQ登录

只需一步,快速开始

查看: 104|回复: 5

[CMS类教程] 【Ripro主题美化】RIPRO修改-菜单增加角标

[复制链接]

1万

主题

1万

帖子

150

积分

网站编辑

Rank: 8Rank: 8

天使之心
0
注册时间
2013-8-22
发表于 2020-2-15 23:19:29 | 显示全部楼层 |阅读模式
效果展示截图:

1.jpg

首先复制如下这段css到/ripro/assets/css/diy.css里:
  1. .vip {
  2. display: inline-block;
  3. transform: translateY(-12px);
  4.     font-size: .75rem;
  5.     letter-spacing: 0.05em;
  6. background: linear-gradient(to top, #efd3b0 0%, #f9e1be 100%);
  7.     color: #ffffff;
  8.     border-radius: 1rem;
  9.     padding: .15rem .275rem;
  10.     line-height: 1;
  11.     font-weight: bold;
  12. }

  13. .new {
  14.     display: inline-block;
  15.     transform: translateY(-12px);
  16.     font-size: .75rem;
  17.     letter-spacing: 0.05em;
  18.     background: linear-gradient(to top, #f308a0 0%, #fb0655 100%);
  19.     color: #ffffff;
  20.     border-radius: 1rem;
  21.     padding: .15rem .275rem;
  22.     line-height: 1;
  23.     font-weight: bold;
  24. }

  25. /*菜单标签美化*/
  26. .label {
  27. display: inline-block;
  28. transform: translateY(-12px);
  29.     font-size: .75rem;
  30.     letter-spacing: 0.05em;
  31. background: linear-gradient(to right, #6454ef 0%, #3021ec 100%);
  32.     color: #ffffff;
  33.     border-radius: 1rem;
  34.     padding: .15rem .275rem;
  35.     line-height: 1;
  36.     font-weight: bold;
  37. }
复制代码
然后到主题下面的菜单设置里,在你的菜单名字后面添加上你需要的代码,如
  1. <span class="vip">真香</span>
复制代码
2.jpg

游客,如果您要查看本帖隐藏内容请回复
本站统一解压密码:www.zheyitianshi.com

0

主题

8

帖子

0

积分

一翼天使

Rank: 1

天使之心
0
注册时间
2020-2-2
发表于 2020-2-18 23:15:41 | 显示全部楼层
PRO修改-菜单增加角标
本站统一解压密码:www.zheyitianshi.com

0

主题

2

帖子

0

积分

一翼天使

Rank: 1

天使之心
0
注册时间
2020-2-20
发表于 2020-2-20 17:38:40 | 显示全部楼层
感谢站长大气分享
本站统一解压密码:www.zheyitianshi.com

0

主题

3

帖子

0

积分

一翼天使

Rank: 1

天使之心
0
注册时间
2020-2-28
发表于 2020-2-29 11:54:52 | 显示全部楼层
286783783dvdsvs
本站统一解压密码:www.zheyitianshi.com

0

主题

4

帖子

0

积分

一翼天使

Rank: 1

天使之心
0
注册时间
2015-4-16
发表于 2020-3-3 03:56:19 | 显示全部楼层
PRO修改-菜单增加角标
本站统一解压密码:www.zheyitianshi.com

QQ|手机版|小黑屋|折翼天使资源社区

GMT+8, 2020-3-30 05:13 , Processed in 0.100710 second(s), 25 queries .

申明:本站资源均来自互联网公开的网络收集整理及二次开发发布,若侵犯了您的合法权益,请告知我们妥善处理。

© 2001-2020 www.zheyitianshi.com 折翼天使资源社区管理团队

快速回复 返回顶部 返回列表