如何在Safari等Webkit浏览器中使用图像作为边框底部？

Question

StackOverflow上有一些关于如何使用边框图像的问题，但这些问题已经过时了。

我们有一个简单的需求：使用图像作为底部边框。我们只需要支持Webkit浏览器，特别是移动Safari。

我们怎么做？

Answer 1

仅针对边框底部的图片，请使用border-bottom-image css3属性。

仅适用于webkit个浏览器，请使用以下-webkit-border-bottom-image

mobile safari supports css3。

<强>更新：

根据css3Info，

只有border-image属性才能在Safari中使用。

所以，use：

-webkit-border-image: url(filePath) 0 0 5 0 repeat;  // top, right, bottom , left
 border-image: url(filePath) 0 0 5 0 repeat;  // top, right, bottom , left

您可能需要查看compatibility table。