border-top: 3px solid #385feb !important;
想让边框颜色渐变 border-top-color: linear-gradient(red, green, blue)没效果
border-top: 3px solid #385feb !important;
想让边框颜色渐变 border-top-color: linear-gradient(red, green, blue)没效果
CSS 不直接支持使用 border-color 属性创建渐变边框。不过,你可以使用 border-image 属性或伪元素来实现渐变边框效果。以下是两种方法:
方法一:使用 border-image
CSS
.element {border: 3px solid;border-image: linear-gradient(to right, red, green, blue) 1;}
这种方法使用 border-image 属性为边框应用渐变效果。
方法二:使用伪元素
CSS
.element {position: relative;padding: 10px;}
.element::before {content: '';position: absolute;top: -3px;left: 0;right: 0;height: 3px;background: linear-gradient(to right, red, green, blue);z-index: -1;}
这种方法使用伪元素创建渐变边框。