1.效果图,设置目录的右框线渐进效果
2.代码
.rightCont>div:nth-child(1){
width: 370px;
height: 100%;
border-right: 2px solid;
border-image: -webkit-linear-gradient(-180deg, rgba(255,255,255,0.00) 0%,#00BBF2 20%, rgba(255,255,255,0.00) 99%) 2 2 2 2;
border-image: -moz-linear-gradient(-180deg, rgba(255,255,255,0.00) 0%,#00BBF2 20%, rgba(255,255,255,0.00) 99%) 2 2 2 2;
border-image: linear-gradient(-180deg, rgba(255,255,255,0.00) 0%,#00BBF2 20%, rgba(255,255,255,0.00) 99%) 2 2 2 2;
}
3.横向:
.ShieldHospitaRightProInfo li{
padding: 20px;
border-bottom: 2px solid;
border-image: linear-gradient(90deg, rgba(0,216,247,0.00) 0%, #00AFED 100%) 2 2 2 2;
border-image: -webkit-linear-gradient(90deg, rgba(0,216,247,0.00) 0%, #00AFED 100%) 2 2 2 2;
border-image: -moz-linear-gradient(90deg, rgba(0,216,247,0.00) 0%, #00AFED 100%) 2 2 2 2;
}
{{itme.name}}
或者
background: -webkit-linear-gradient(left,rgba(0,216,247,0),rgba(0,175,237,1));