CSS3 在同一长页面中应用时出现渐变问题

Question

我想创建具有相同渐变的页眉和页脚。我使用了下面的代码来实现相同的目标。但是当我在任何浏览器中查看它时，认为我在页脚中使用相同的颜色，随着页眉和页脚之间距离的增加，页脚渐变的阴影会变浅。

<div style="
filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#FBB511, endColorstr=#F6941C);
background: -webkit-gradient(linear, left top, left bottom, from(#FBB511), to(#F6941C));
background: -moz-linear-gradient(top, #FBB511, #F6941C);
background: -ms-linear-gradient(top,  #FBB511 ,#F6941C); width:1000px; height:40px"></div>

某种渐变清除或什么可以帮助？我该如何解决这个问题？

谢谢。

Answer 1

这不是编码问题，而是视图视角，如果您对页眉和页脚使用相同的 css 颜色和代码，它们是相同的。尝试站起来，从屏幕顶部看。您应该看到页眉变暗，页脚变亮。

要进行确认，您可以创建两个位置固定的并排标记，并查看页脚是否与页眉匹配。

Answer 2

试试这个页面

Colorzilla - CSS3 Factory - IE Gradient generator - Google