css3实现圆角边框渐变


<button class="border">112233</button>

  创建button

.border{
	position: relative;
	border: 4px solid transparent;
	border-radius: 16px;
	background: linear-gradient(orange, violet);
	background-clip: padding-box;
	padding: 10px;
	/* just to show box-shadow still works fine */
	box-shadow: 0 3px 9px black, inset 0 0 9px white;
}
.border::after{
	position: absolute;
	top: -4px; bottom: -4px;
	left: -4px; right: -4px;
	background: linear-gradient(red, blue);
	content: '';
	z-index: -1;
	border-radius: 16px;
}

  css3样式


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM