因为boder-image和和border-radius会冲突,所以用以下方式可以优雅实现渐变圆角边框:
div {
border-radius: 8px 8px 8px 8px;
border: 1px solid transparent;
background-image: linear-gradient(#121a24, #121820),// 跟背景色保持一致,根据实际情况修改
linear-gradient(90deg, rgba(10, 229, 246, 1), rgba(51, 64, 254, 1));// 取border-image的渐变色,按实际来修改
background-origin: border-box;
background-clip: content-box, border-box;
}