这个角标貌似很流行,连老油条在更新的它的站都用到了,汇站网今天就分享下 RIPRO 修改-菜单增加角标方法。效果如上图,当然颜色随你定,很简单!
方法
首先复制这段css
到/ripro/assets/css/diy.css
里,
.vip { display: inline-block; transform: translateY(-12px); font-size: .75rem; letter-spacing: 0.05em; background: linear-gradient(to top, #efd3b0 0%, #f9e1be 100%); color: #ffffff; border-radius: 1rem; padding: .15rem .275rem; line-height: 1; font-weight: bold; } .new { display: inline-block; transform: translateY(-12px); font-size: .75rem; letter-spacing: 0.05em; background: linear-gradient(to top, #f308a0 0%, #fb0655 100%); color: #ffffff; border-radius: 1rem; padding: .15rem .275rem; line-height: 1; font-weight: bold; } /*菜单标签美化*/ .label { display: inline-block; transform: translateY(-12px); font-size: .75rem; letter-spacing: 0.05em; background: linear-gradient(to right, #6454ef 0%, #3021ec 100%); color: #ffffff; border-radius: 1rem; padding: .15rem .275rem; line-height: 1; font-weight: bold; }
然后到主题下面的菜单设置里,在你的菜单名字后面添加上你需要的代码,如
<span class="vip">真香</span>
本文章已结束,如转载请注明:汇站网 » RIPRO 美化之菜单增加角标 WordPress 美化教程
免责声明
1 网站名称:汇站网
2 永久网址:https://www.huizhanii.com
3 本站资源来源于网友投稿和付费购买,仅供编程人员及源代码爱好者下载参考与研究,不提供任何技术支持服务!
4 资源展示图片及相关信息仅供参考,不代表本站立场!本站仅作为信息存储平台
5 禁止在服务器和虚拟机上搭建运营,所有资源仅限本地调试与研究使用,不支持联网运行!
6 未经版权方授权,严禁用于商业用途。使用者如违反国家法律法规,需自行承担全部法律责任!
7 请在下载后24小时内删除!建议支持正版授权作品
8 如资源侵犯您的合法权益,请提供版权证明及相关作品信息发送至邮箱:972908224@qq.com我们将及时处理
9 如遇下载链接失效或支付未到账,请联系站长处理
10 欢迎投稿优质源码或教程,审核通过后将获得相应奖励
11 资源收费仅用于维持网站正常运营
12 数字商品具有特殊性质,一经购买概不退款
13 查看更多详情

下一篇: RiPro主题设置之高级分类文章菜单
常见问题
相关文章
猜你喜欢
- WordPress 子比(Zibll)主题适配的发卡功能插件源码 2025-06-26
- 针对WordPress(简称WP)平台下的zibll子比主题,其配套的发卡功能插件的完整源码 2025-05-26
- 最新WordPress全站整合包,内含免授权子比主题8.1及网创资源自动同步更新功能 2025-03-21
- WordPress AI文章自动生成与配图、长尾关键词衍生、内容批量抓取 2025-03-04
- WordPress教程:纯代码实现文章摘要添加ai功能 2024-12-03
- WordPress精简版CMS主题样式Class 2024-11-28
- WP-AutoPostPro中文版:WordPress高效自动内容采集与发布插件 2024-11-26
- 为WordPress网站页面添加水印的教程——附带JS源代码 2024-11-26
- WordPress教程 在文章的侧边栏添加一项滚动公告功能 2024-11-26
- WordPress主题美化升级 – 在侧边栏添加古诗一言小工具 2024-11-26
热门评论
热门文章
- 2021-11-07 1,198
- 2021-05-13 1,687
- 2021-04-30 800
RIPRO主题首页全屏动态幻灯片美化模块横屏滚动模块WordPress主题美化
2021-05-01 1,229- 2021-08-19 1,144
热门标签
- 底部安全认证代码霸屏天下赚钱猫蚂蚁帮扶短视频直播系统源码成人高考信息门户网站的源代码袋鼠投资学习版圣诞网页动画人力资源招聘网站源码付费创作系统独立版本,支持WEB、H及小程序多端访问蝶影全网VIP影视APP源码最新版有声阅读付费源码养生健康模板在线课程学习辅导类系统星火支付新闻资讯门户网站源码布谷直播系统电影网站模板Rank Math SEO PRO v3.0.14 已激活版翻转动画html新版国际虚拟实体交易所源码收款即时到账API支付系统源码HTML5源码unity3d游戏如何实现自定义dedecms系统变量乐步2.0走路赚钱GG脚本编辑器WordPress QQ互联授权登录美女图片大全站帝国CMS源码在线评估价格及回收mp4影音播放器代码云豹金山版直播app调用FlashFXP