css - 使用像素测量时，渐变末端模糊

Question

我正在使用background-image: linear-gradientcss 属性为站点背景创建多个颜色条。
通常渐变停止是按百分比定义的，但我需要在我的站点中使用像素，所以我设法使用 lea Verou 在她的模式中使用的方法将其更改为像素 问题是每种颜色的结尾有点模糊。在 Firefox 中它不太明显，但在 Chrome 中却非常明显。
有没有办法处理它？
我注意到当我将“度”从 180 更改为 45 时，两端看起来很棒。但不幸的是我需要条纹是水平的:)

我的代码：http ://cssdesk.com/c6mGM

Answer 1

差不多一年后，我在 chrome v36 中遇到了同样的错误。我在这里做了一个工作：http: //codepen.io/davidgailey/pen/ncrKB

或者如果您愿意，可以在这里： https ://gist.github.com/davidgailey/8fc1bd1a09747429a3ad

解决方法使用背景大小、背景位置和线性渐变。

background-size: 100% 150px, 100% 150px;
background-position: 0 0, 0 bottom;
background-image:
linear-gradient(#000,#000),
linear-gradient(green, green);

中提琴！漂亮清晰的横条纹。它可以使用一些工作来对未来更加友好。

我希望这个错误很快得到修复，但与此同时，请随时使用我的笔作为开始。