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

速优网络（10年经验），服务数万家企业，固定透明报价。域名注册、主机/服务器、网站源码一站式服务。实体公司，专业团队，值得选择！建站业务：企业网站建设、公司官网制作、外贸网站建设、网站仿制、网站复制、仿站、外贸建站、单页扒站客服微信【suyoufuwu】

<style>

.logo {

position: relative;

font-size:1em;

font-weight:200;

line-height:19px;

overflow:hidden;

margin:0;

模仿ripro主题很多站的logo扫光效果(图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;

模仿ripro主题很多站的logo扫光效果(图1)

}

@-webkit-keyframes searchLights {

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

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

模仿ripro主题很多站的logo扫光效果(图1)

}

</style>

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

以上就是速优网络和大家分享的"模仿ripro主题很多站的logo扫光效果",非常感谢您有耐心的读完这篇文章，我们将为您提供更多参考使用或学习交流的信息。我们还可为您提供：企业网站建设、网站仿制、网站复制、仿站、外贸网站建设、外贸建站、公司官网制作等服务，本公司以“诚信、专业、务实、创新”的服务理念服务于客户。如您需要合作，请扫码咨询，我们将诚挚为您服务。

TAG标签：

上一篇： eyoucms 如何调用当前文档的tag

下一篇：如何在易优文章编辑器里面加入新的字体