如何在CSS中展開單獨的背景圖像

Question

background: url(timages/wb-right.png) 100% 0 no-repeat, url(timages/wb-left.png) 0 0 no-repeat, url(timages/wb-top.png) 0 0 no-repeat, url(timages/wb-bottom.png) 0 80px no-repeat; 

我目前有此代碼指定4個圖像作爲背景的框。每邊有一個。左上方右下方。

唯一的問題是頂部和底部圖像不能拉伸或重複框的全部寬度。這有可能做到。如果我設置了任何不重複的重複它填充整個背景。

任何意見，樂於助人

Answer 1

你要找的東西是這樣的：

演示：http://jsfiddle.net/abhitalks/dgcfK/

background-image: url(timages/wb-top.png), 
    url(timages/wb-left.png), 
    url(timages/wb-right.png), 
    url(timages/wb-bottom.png); 
background-position: left top, left bottom, top right, bottom right; 
background-repeat: repeat-x, repeat-y, repeat-y, repeat-x;