css - WebKit CSS : Use for -webkit-border-image a picture from an image array

Question

在我的 iPhone/Android/BB6 网络应用程序中，我尝试将所有图像放入图像数组(类似此处 http://goo.gl/VcMcj )，以优化加载时间。

在大多数情况下，它可以很好地配合背景位置/宽度/高度属性。现在我想将我的 -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

---

我无法使用文本框边框，所以我留下了那个:

这是我在放弃之前制作并尝试过的图像，如果它有帮助的话: