Question

我有以下css用于背景颜色/渐变：

background-color: #FFFFFF;
background: -moz-linear-gradient(top,  #d7d6d2,  #f9ffff);
background-image: linear-gradient(top,  #d7d6d2,  #f9ffff);
background-image: -o-linear-gradient(top,  #d7d6d2,  #f9ffff);
background-image: -moz-linear-gradient(top,  #d7d6d2,  #f9ffff);
background-image: -webkit-linear-gradient(top,  #d7d6d2,  #f9ffff);
background-image: -ms-linear-gradient(top,  #d7d6d2,  #f9ffff);

使用这个我能够完成我需要的但是在渐变结束后有一个浅灰色而不是白色。我可以做什么，以便在渐变结束后白色开始显示？

Answer 1

将容器背景设置为白色。在这种情况下，它使用html和正文DEMO http://jsfiddle.net/kevinPHPkevin/RxXHz/

来完成

CSS

html {
    height:100%;
    background-color: #FFFFFF;
}
body {
    padding:0;
    margin:0;
    width:100%;
    height:100%;
    background-color: #FFFFFF;
    background: -moz-linear-gradient(top, #d7d6d2, #f9ffff);
    background-image: linear-gradient(top, #d7d6d2, #f9ffff);
    background-image: -o-linear-gradient(top, #d7d6d2, #f9ffff);
    background-image: -moz-linear-gradient(top, #d7d6d2, #f9ffff);
    background-image: -webkit-linear-gradient(top, #d7d6d2, #f9ffff);
    background-image: -ms-linear-gradient(top, #d7d6d2, #f9ffff);
}

Answer 2

查看渐变定义，为什么不将结束颜色设置为纯白色：

background-image: linear-gradient(top,  #d7d6d2,  #ffffff);

目前，你的结局颜色接近白色#f9ffff，大多数人都没有足够的眼睛来区分差异。

Answer 3

该渐变的白色部分将转到分配给它的任何元素的底部。我的猜测是你有一些不属于白色的东西。

如何在渐变结束后显示白色而不是灰色？

3 个答案: