CoreNext主题美化_彩虹分割线美化

推荐 福利

之前更新过一款分割线美化代码，后来因为网站的其他美化导致失效，也没有专门排查是哪里有冲突，再往后索性就直接删除了之前的分割线美化，今天好软猫又重新使用起了分割线，更新一个彩虹分割线的代码~

效果演示

代码

/*分割线美化_好软猫www.haoruanmao.com*/
hr {
	border: 0;
	/* 清除默认边框*/
	height: 2px;
	/* 设置高度*/
	background: linear-gradient(to right, #4285f4, #34a853, #fbbc05, #ea4335);
	/* 使用渐变颜色作为背景*/
	margin: 20px 0;
	/* 设置上下边距*/
	background-size: 400% 100%;
	/* 添加背景尺寸*/
	animation: colorChange 4s linear infinite;
	/* 添加动画效果*/
}

@keyframes colorChange {
	0% {
		background-position: 100% 0;
	}

	100% {
		background-position: -100% 0;
	}
}
/*分割线美化_好软猫www.haoruanmao.com*/