如何在其后面有一个纯色的渐变背景延伸到页面底部？

Question

我试图以各种不同的方式做到这一点，但到目前为止还没有成功。

基本上我想要的是页面下方的渐变（我正在使用背景图像），然后一旦图像结束，我想要一个背景颜色来接管（这样页面就不会变成白色）。

我已经尝试过使用不同的div标签等来分层等等，但到目前为止还没有运气。背景颜色覆盖图像，或颜色不会延伸到页面底部。

Answer 1

你可能想做这样的事情：

body
{
  background: #FFCC00 url('your-background.png') repeat-x;
}

Answer 2

尝试这样的事情：

http://jsfiddle.net/pUKeT/

body{
  background: blue url(http://www.laserasecroydon.com/assets/images/blue-gradient.jpg) no-repeat fixed left top;
}

它不漂亮，但通过这种方式你可以看到颜色应该占据的位置

Answer 3

body{    
background:url("image.jpg") #COLOR no-repeat;
}

Answer 4

谢谢你们，我已经解决了。我使用的CSS很好，这是问题的图像。它不是将背景设置为白色，而是透明的。因此，颜色通过并覆盖了渐变。我现在将背景设置为白色，并且工作正常。