WebKit CSS：用于-webkit-border-image图像数组中的图片

Question

在我的iPhone / Android / BB6的webapp中我尝试将所有图像放入图像数组（类似于此处http://goo.gl/VcMcj），以优化加载时间。

在大多数情况下，它适用于background-position / width / height-properties。 现在我想将我的-webkit-border-image放入图像数组中，但无法弄清楚如何。

有可能吗？

提前提醒！

Answer 1

我将前两个按钮组合并调整为一个图像：

Live Demo

#leftnav a:first-child {
    /* 0 5 0 13 */
    -webkit-border-image: url(http://i.stack.imgur.com/Iz5Jl.png) 0 5 30 13
}

#leftbutton a,#rightbutton a,#imbutton a {
    /* 0 5 0 5 */
    -webkit-border-image: url(http://i.stack.imgur.com/Iz5Jl.png) 30 5 0 5
}

可能不值得为这里涉及的小文件大小和图像数量而烦恼。

---

在我看到这个时，我找到了一个让测试更容易的网站：

http://border-image.com

---

我无法使用文本框边框，所以我只留下了一个：

这是我制作的图像，在我放弃之前尝试使用它，如果有帮助的话：