如何使用 -moz-repeating-linear-gradient 将背景翻译为 -webkit（具体示例）答案

【问题标题】：How to translate background using -moz-repeating-linear-gradient to -webkit (specific example)如何使用 -moz-repeating-linear-gradient 将背景翻译为 -webkit（具体示例）
【发布时间】：2011-04-26 07:15:18
【问题描述】：

我在 Firefox 中做了这个背景，但我无法在 webkit/chrome 中复制它（我尝试了几种替代方法，但没有）：

background: -moz-repeating-linear-gradient(0deg, gray, transparent 1px, transparent 5px) repeat scroll 0 0 white;

什么是正确的翻译？有可能实现相同的模式吗？（或至少非常接近）。

谢谢！

【问题讨论】：

标签： webkit css linear-gradients

【解决方案1】：

哦！它在文档中！：

http://www.webkit.org/blog/175/introducing-css-gradients/

如果你想达到这样的效果使用 a 平铺垂直渐变窄条，你应该指定 background-size 给出渐变平铺一个明确的大小。

所以它是固定添加：

background-size: 10px;

Gecko 和 Webkit 在这件事上的行为不同：如果您在“px”中指定渐变步骤，Gecko 会自动调整背景大小，但 webkit 将（可能）根据您设置的“px”度量计算 %。

我不确定我的英语是否正确，但这就是我的想法......

【讨论】：

【解决方案2】：

-webkit-repeating-greadient(...) :)

受 Chrome 和 Webkit nightlies 支持。

【讨论】：

left top 0deg 不是正确的角度，它已从规范中删除（我认为是为了更容易解析）。您需要选择两者之一，left top 或 0deg。我猜你实际上想要top 或0deg（它们是等价的）。
是的......由于某种原因，我最终混合了它......我会更正它。感谢您指出这一点并首先尝试提供帮助。