-webkit-border-radius和-webkit-border-image同时进行。它有用吗？

Question

是否可以使用webkit背景渐变来围绕元素的角落？以下代码似乎忽略了圆角。

#mydiv {
        border-width: 10px;
        width: 75px;
        height: 75px;
        margin: 0px;
        -webkit-border-radius: 10px;
        -webkit-border-image: 
            -webkit-gradient(linear, left top, left bottom,
             color-stop(0%,#f6f5f8),
             color-stop(25%,#7e7699),
             color-stop(50%,#120634),
             color-stop(75%,#7e7699),
             color-stop(100%,#f5f5f8)) 10;

}

Answer 1

尝试使用background-image而不是border-image。例如：

.mydiv {
        width: 75px;
        height: 75px;
        margin: 0px;
        border-radius: 10px;
        background-image:
        -webkit-gradient(linear, left top, left bottom, 
                color-stop(0%,#f6f5f8),
                color-stop(25%,#7e7699),
                color-stop(50%,#120634),
                color-stop(75%,#7e7699),
                color-stop(100%,#f5f5f8));
}