WebKit CSS: используйте для -webkit-border-image изображение из массива изображений

Question

в моем веб-приложении для iPhone / Android / BB6 Я пытаюсь поместить все изображения в массив изображений (что-то вроде здесь 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

---

Мне не удалось заставить работать текстовую рамку, поэтому я оставил ее одну:

Это изображение, которое я сделал и пытался использовать, прежде чем сдаться, если это поможет: