如图所示,渐变的边框是一个 li
标签,要给他的border-bottom
设置颜色渐变。
# CSS
li.active {
color: #C66214;
background-origin: padding-box,border-box;
background-image: linear-gradient(135deg,#FFFFFF,#FFFFFF),linear-gradient(-90deg, #FFBA33 0%, #B3450A 100%);
border-bottom: .04rem solid;
border-image: linear-gradient(-90deg, #FFBA33, #B3450A);
}
background-image
中的第一个 linear-gradient
是设置li
标签的背景色的,
第二个 linear-gradient
配合 border-image
即可设置 border
的渐变色。
网友评论