WebKit CSS：用於-webkit-border-image來自圖像陣列的圖片

在我的webapp for iPhone/Android/BB6中我嘗試將所有圖像放入圖像數組（例如http://goo.gl/VcMcj），以優化加載時間。WebKit CSS：用於-webkit-border-image來自圖像陣列的圖片

在大多數情況下，它可以很好地處理background-position/width/height-properties。現在我想將我的-webkit邊框圖像放入圖像數組中，但無法弄清楚。

這可能嗎？

Thnaks提前！

來源

2011-02-14 Daniel

在移動瀏覽器上有什麼不是特別有效嗎？它在桌面Safari中工作嗎？你可以做一個[jsFiddle]（http://jsfiddle.net）的例子嗎？ – thirtydot 2011-02-14 09:36:42

我組合並調整了前兩個按鈕爲一個圖像：

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

我無法得到的文本框邊境工作，所以我只剩下那個人了：

這是我製作的圖片，在嘗試之前我放棄了，如果有幫助：

來源

2011-02-15 03:07:52 thirtydot

WebKit CSS：用於-webkit-border-image來自圖像陣列的圖片

回答

相關問題