菜单 eyoucms模板网

站长经验总结
<style>.logo { position: relative; font-size:1em; font-weight:200; line-height:19px; overflow:hidden; margin:0;}.logo::before{ content:""; position: absolute;

模仿ripro主题很多站的logo扫光效果

发布时间:2021-12-08 13:44:04
点击次数:50
复制本文链接

<style>

.logo {

    position: relative;

    font-size:1em;

    font-weight:200;

    line-height:19px;

    overflow:hidden;

    margin:0;

(图1)

}

.logo::before{

    content:"";

    position: absolute;

    width: 100px;

    height: 20px;

    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;

(图1)

}

@-webkit-keyframes searchLights {

    0% { left: -90px; top: 0; }

    to { left: 90px; top: 0; }

(图1)

}

</style>

复制以上css放到页面上,或者css文件里面,css类要根据你的具体名称更换下,即可达到和本站logo一样的扫光效果

收藏

相关文章

加载中~
模板购买咨询
定制仿站咨询
24小时客服
18030990768


模板购买咨询
定制仿站咨询
24小时客服
18030990768