Question

我遇到了圆角和边框图像的问题。边框图像保持正方形，div具有圆角。我需要的是图像边框与边界半径的圆角一起使用。

-webkit-border-radius: 20px;
-moz-border-radius: 20px;
border-radius: 20px;
border:2px solid;
-moz-border-image: url(neon---horizontal-hotness-wallpapers_18493_1920x12001.jpg) 2 1 2 2 round;
-webkit-border-image: url(neon---horizontal-hotness-wallpapers_18493_1920x12001.jpg) 2 1 2 2 round;
-o-border-image: url(neon---horizontal-hotness-wallpapers_18493_1920x12001.jpg) 2 1 2 2 round;
border-image: url(neon---horizontal-hotness-wallpapers_18493_1920x12001.jpg) 2 1 2 2 round;
width:100%;

Answer 1

必须指定border-style和border-width（未设置为none或0）才能使border-images工作。它有一个错误，其中border-image错误地覆盖了border-style。这link 1可能会有所帮助

Answer 2

无法在border-radius

处放置图像

框的背景，但不是其边框图像，被剪裁到适当的曲线（由'background-clip'确定）。剪切到边框或填充边缘的其他效果（例如“溢出”除“可见”之外）也必须剪切到曲线。替换元素的内容始终被修剪为内容边缘曲线。此外，边框边缘曲线外的区域不会代表元素接受鼠标事件。

边界图像，边界半径

2 个答案: