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

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

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

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中添加);添加完成如没有显示,记得更新一下浏览器缓存!

喜欢 0
1. 本站所有源码、模板、插件等其他资源,都不包含免费技术服务请大家谅解!
2. 本站提供的所有资源不免费提供个人需要的资源修改、美化、功能定制!
3. 如遇需要解压密码,则解压密码为"www.360mb.net"!
4. 由于源码属于可复制性产品,发货后禁止买家以各种理由退款!!
5. 本站提供资源如遇源码失效,功能异常等等可提供退款服务,可参考《退款规则》!
6. 本站资源售价只是赞助,收取费用仅维持本站的日常运营所需!
7. 如用于商业或者非法用途,与本站无关,一切后果请用户自负!

360模板吧 » RiPro主题给Logo添加扫光CSS效果

发表评论