子比主题美化 给WordPress网站添加一个彩色渐变的从右往左移动公告

图片[1]-子比主题美化 给WordPress网站添加一个彩色渐变的从右往左移动公告-壹叁博客网

在别的网站看到有这么一个从右往左移动的网站公告,转载给免费分享给本站的用户,也方便自己学习使用。

使用方法

进入WP后台,找到外观→小工具→自定义HTML,把如下代码添加到自定义HTML中,代码放置位置的话你随意就好了。可以在不同的界面放入不同的公告。

<div class="textwidget custom-html-widget">
<style>#nr{font-size:20px;margin: 0;background: -webkit-linear-gradient(left,#ffffff,#ff0000 6.25%,#ff7d00 12.5%,#ffff00 18.75%,#00ff00 25%,#00ffff 31.25%,#0000ff 37.5%,#ff00ff 43.75%,#ffff00 50%,#ff0000 56.25%,#ff7d00 62.5%,#ffff00 68.75%,#00ff00 75%,#00ffff 81.25%,#0000ff 87.5%,#ff00ff 93.75%,#ffff00 100%);-webkit-background-clip: text;-webkit-text-fill-color: transparent;background-size: 200% 100%;animation: masked-animation 2s infinite linear;}@keyframes masked-animation {0% {background-position: 0 0;}100% {background-position: -100%, 0;}}</style><div style="background-color:#333;border-radius:25px;box-shadow:0px 0px 5px #f200ff;padding:5px;margin-top:10px;margin-bottom:0px;"><marquee>
<b id="nr">公告:欢迎光临壹叁博客网,每天签到可领取积分,积分可免费兑换VIP会员</b> </marquee></div>
</div>

效果展示

图片[2]-子比主题美化 给WordPress网站添加一个彩色渐变的从右往左移动公告-壹叁博客网

 

 

温馨提示:本文最后更新于2024-09-30 16:14:42,某些文章具有时效性,若有错误或已失效,请在下方留言或联系QQ624964405
© 版权声明
THE END
喜欢就支持一下吧
点赞10 分享
评论 抢沙发
头像
欢迎您留下宝贵的见解!
提交
头像

昵称

取消
昵称表情代码图片

    暂无评论内容