给网站LOGO添加扫光特效

一段css代码：如果你是WordPress程序，那么请在当前主题css文件最下方添加如下代码，需注意：代码中的#logo:before，根据自己的实际情况修改为当前主题的Logo元素选择器名称。

/**logo扫光效果CSS**/ #logo:before{ /**根据logo外div样式名称修改before前名称**/ content:""; position: absolute; left: -665px; /**第一个数字参数控制扫光速度，数字越大越慢**/ top: -460px; width: 200px; height: 10px; /**光标的宽度，可根据实际调整**/ background-color: rgba(255,255,255,.5); -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -o-transform: rotate(-45deg); transform: rotate(-45deg); -webkit-animation: searchLights 1s ease-in 1s infinite; -o-animation: searchLights 1s ease-in 1s infinite; animation: searchLights 1.5s ease-in 1s infinite;/**第一个数字参数控制扫光速度，数字越大越慢**/ } @-webkit-keyframes searchLights { 0% { left: -100px; top: 0; } to { left: 120px; top: 100px; } } @-o-keyframes searchLights { 0% { left: -100px; top: 0; } to { left: 120px; top: 100px; } } @-moz-keyframes searchLights { 0% { left: -100px; top: 0; } to { left: 120px; top: 100px; } } @keyframes searchLights { 0% { left: -100px; top: 0; } to { left: 120px; top: 100px; } }

此效果也适用于其他建站程序，其仅仅是一个CSS效果而已。
:before 选择器介绍
:before 选择器在被选元素的内容前面插入内容。
请使用 content 属性来指定要插入的内容。
所有主流浏览器都支持:before选择器。
注意: before在IE8中运行，必须声明 < !DOCTYPE> 。