wp子比主题 LOGO 扫光教程,鼠标移动到图片时外边框自动发光

1. 1. wp子比主题 LOGO 扫光教程

子比主题设置—>自定义代码—>自定义 CSS 样式，添加以下 CSS 代码即可：

	/* logo扫光 */
	.navbar-brand {
		position: relative;
		overflow: hidden;
		margin: 0px 0 0 0px;
	}

	.navbar-brand:before {
		content: "";
		position: absolute;
		left: -665px;
		top: -460px;
		width: 200px;
		height: 15px;
		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 6s ease-in 0s infinite;
		-o-animation: searchLights 6s ease-in 0s infinite;
		animation: searchLights 6s ease-in 0s infinite;
	}

	@-moz-keyframes searchLights {
		50% {
			left: -100px;
			top: 0;
		}

		65% {
			left: 120px;
			top: 100px;
		}
	}

	@keyframes searchLights {
		40% {
			left: -100px;
			top: 0;
		}

		60% {
			left: 120px;
			top: 100px;
		}

		80% {
			left: -100px;
			top: 0px;
		}
	}

2.WP文章内鼠标移动到图片时外边框自动发光

/*鼠标移动图片时外发光*/
.wp-posts-content img:hover {
box-shadow:0px 0px 8px #63B8FF;
}