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;

如何在CSS中拉伸单个背景图像

1 个答案: