border边框渐变

 

 

.item{

      width: 2.5rem;

      height: 0.48rem;

  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) 0%, #3196fa 50%, rgba(255, 255, 255, 0) 99%) 2 2 2 2;

}

 .

item {

        height: 2.7rem;

        width: 100%;

        border-bottom: 2px solid;

  border-image: -webkit-linear-gradient(90deg, #3196fa 50%, rgba(255, 255, 255, 0) 100%) 2 2 2 2;

  border-image: -moz-linear-gradient(90deg, #3196fa 50%, rgba(255, 255, 255, 0) 100%) 2 2 2 2;

        border-image: linear-gradient(90deg, #3196fa 50%, rgba(255, 255, 255, 0) 100%) 2 2 2 2;

}

 


版权声明:本文为snowXZZ原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接和本声明。