如何固定渐变背景

Question

我想知道是否有可能修复来自HTML标签的梯度:

html, body, .wrapper {
    height: 100%;
}
body > .wrapper {
    height: 100%;
    min-height: 100%;
}
html {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 14px;
    background-attachment: fixed !important;
    background-image: green;
    background-image: -webkit-gradient(linear, 0 0, 0 100%, from(green), color-stop(20%, #fff), color-stop(80%, #fff), color-stop(100%, green));
    background-image: -webkit-linear-gradient(left, green, #fff 20%, green 100%);
    background-image: -moz-linear-gradient(left, green, #fff 20%, green 100%));
    background-image: -o-linear-gradient(left, green, #fff 20%, green 100%));
    background-image: -ms-linear-gradient(left, green, #fff 20%, green 100%));
    background-image: linear-gradient(left, green, #fff 20%, green 100%));
}

这样当你调整浏览器窗口的大小时，渐变不会移动。

这可能吗?

谢谢。

Answer 1

设置一个特定的px值:

background: linear-gradient(to right, green 0%, #fff 300px, green 100%);

http://jsfiddle.net/GuMKd/

考虑使用这个工具:http://www.colorzilla.com/gradient-editor/