拉伸背景图片

Question

I have a background image with size 1x947 px ,

the problem is it's a gradient color , so i only use repeat-x , but when the page height over 947 px , it shows it background color,

background-image:url(bg.gif);
background-repeat:repeat-x;

how to stretch it ?

here's the code example on fiddle http://jsfiddle.net/K9cUd/1/

Answer 1

Hard to tell without the code or an example.

You could use CSS3's

background-size: 100%;

which should stretch it to the entire page size.

You might need to do

background-size: 0 100%; or background-size: 0% 100%;

so the width does not change.

You can read more here: http://webdesign.about.com/od/styleproperties/p/blspbgsize.htm

And the spec: http://www.w3.org/TR/css3-background/#the-background-size

Answer 2

如果您不想使用百分比，请使用：

    background-size: cover;