CSS使我的背景以颜色开始，以另一种（相似）颜色结束背景图像：线性渐变答案

【问题标题】：CSS make my background statrs with color and end with another (similar) color background-image: linear-gradientCSS使我的背景以颜色开始，以另一种（相似）颜色结束背景图像：线性渐变
【发布时间】：2013-09-27 17:44:02
【问题描述】：

从顶部 #3a5976 到底部 #2c4762

如果阅读困难，请复制到您的文本编辑器中

<html>
  <head>
    <style>
      body {
        background-image: linear-gradient(bottom, rgb(70,125,149) 19%, 
                          rgb(98,163,179) 60%, 
                          rgb(56,122,122) 80%);
        background-image: -o-linear-gradient(bottom, rgb(70,125,149) 19%, 
                          rgb(98,163,179) 60%, 
                          rgb(56,122,122) 80%);
        background-image: -moz-linear-gradient(bottom, rgb(70,125,149) 19%, 
                          rgb(98,163,179) 60%, 
                          rgb(56,122,122) 80%);
        background-image: -webkit-linear-gradient(bottom, rgb(70,125,149) 19%, 
                          rgb(98,163,179) 60%, 
                          rgb(56,122,122) 80%);
        background-image: -ms-linear-gradient(bottom, rgb(70,125,149) 19%, 
                          rgb(98,163,179) 60%, 
                          rgb(56,122,122) 80%);
           }
    </style>
  </head>
  <body>

  </body>

【问题讨论】：

formatted it properly(:)
你的问题是什么？
这样，更具可读性。

标签： html css background styling

【解决方案1】：

用您的十六进制值替换您示例中的 rgb() 值：

body{
background-color: #2c4762; /* fallback for browsers that don't support gradient */
background-image: linear-gradient(bottom, #2c4762, #3a5976 );
background-image: -o-linear-gradient(bottom, #2c4762, #3a5976 );
background-image: -moz-linear-gradient(bottom, #2c4762, #3a5976 );
background-image: -webkit-linear-gradient(bottom, #2c4762, #3a5976 );
background-image: -ms-linear-gradient(bottom, #2c4762, #3a5976 );
}

这是一个有效的小提琴（使用#content DIV 代替正文）：http://jsfiddle.net/daNUM/

【讨论】：

thanx ，如果我想让它达到特定数量 4 示例颜色变为页面底部，滚动后停止变化，直到颜色相同。？跨度>
我不知道你能做到，因为我从来没有尝试过渐变，但你可以设置像background-attachment:fixed;这样的固定属性，请参阅此处更新的小提琴：jsfiddle.net/daNUM/1（更改顶部将颜色渐变为白色，因此更容易注意到）