RiPro主题给Logo添加扫光CSS效果

作者 : admin 本文共652个字,预计阅读时间需要2分钟 发布时间: 2020-04-24 共271人阅读

一个非常不错的RIPRO主题LOGO扫光样式,其实这个样式有很多分享,不过很多都是收费的,今天我们也来发一个免费分享给大家。

1.可以直接登陆后台,找到RiRro主题设置 - 顶部设置 - 自定义CSS样式代码,在输入中添加以下CSS代码(这里美化 不怕更新 哈哈哈):

.logo-wrapper {
    position: relative;
    font-size:2em;
    font-weight:700;
    line-height:39px;
    overflow:hidden;
    margin:0;
}
.logo-wrapper::before{
    content:"";
    position: absolute;
    width: 150px;
    height: 10px;
    background-color: rgba(255,255,255,.5);
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
    -webkit-animation: searchLights 1s ease-in 1s infinite;
    animation: searchLights 1s ease-in 1s infinite;
}
@-webkit-keyframes searchLights {
    0% { left: -90px; top: 0; }
    to { left: 90px; top: 0; }
}

2.当然大家也可以在主题文件diy.css文件中添加上面的css样式(安装了子主题的就在子主题的diy.css中添加);添加完成如没有显示,记得更新一下浏览器缓存!

1. 本站所有资源来源于用户上传和网络,如有侵权请邮件联系站长
2. 如遇需要解压密码,则解压密码为"www.360mb.net"!
3. 如果你也有好源码或者教程,可以到审核区发布,分享有金币奖励和额外收入!
4. 本站提供的源码、模板、插件等等其他资源,都不包含技术服务请大家谅解!
5. 如有链接无法下载、失效或广告,请联系管理员处理!
6. 本站资源售价只是赞助,收取费用仅维持本站的日常运营所需!
7. 本站不保证所提供下载的资源的准确性、安全性和完整性,源码仅供下载学习之用!
8. 如用于商业或者非法用途,与本站无关,一切后果请用户自负!
360模板吧 » RiPro主题给Logo添加扫光CSS效果

发表评论