Главная > CSS > border gradient

border gradient

Используется border-image-source и border-image-slice

header{
	height:800px;
	background:url("../images/header.jpg") no-repeat top center;
	background-size:cover;
	box-sizing:border-box;
	padding-top:80px;
	position:relative;
	&:after,&:before{
		content:'';
		display:block;
		width:~"calc(100% - 60px)";
		height:~"calc(100% - 45px)";
		position:absolute;
		border:3px solid @color_gold;
		border-image-source:linear-gradient(90deg,#dcae72 0%,#f9a73b 27.72%,#dcae72 54.07%,#ee8f13 78.85%,#dcae72 101.19%);
		border-image-slice:1;
		box-sizing:border-box;
	}
	&:after{
		top:15px;
		left:20px;
	}
	&:before{
		top:30px;
		left:40px;
	}
}
Categories: CSS Tags:
  1. Пока что нет комментариев.
Похожие публикации