效果:
<div class="line"></div>
.line {height: 1px;background: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, #a9c2ff 50%, rgba(255, 255, 255, 0) 100%);border-radius: 4px 4px 4px 4px;
}
CSS实现边框底部渐变色的方法:(最简单的一种)
.item-box {border-bottom: 1px solid;border-image-source: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, #00bbf2 20%, rgba(255, 255, 255, 0) 100%);border-image-slice: 1;
}
参考文章:
CSS实现边框底部渐变色的4种方法_css下边框渐变-CSDN博客