线性渐变+背景大小在Firefox中不起作用

Question

我使用背景大小为 400% 的线性渐变。这允许我通过更改背景位置在悬停和活动状态之间的渐变之间设置动画。它在 webkit 中工作得很好，但在 Firefox 中却不行。似乎 background-size 属性根本没有被承认。

Firefox 基本上只是挤压元素中的整个渐变，就好像背景大小设置为 100%。

我有一个超级简单的页面来演示这个问题：

http://firefoxgradient.s.cboo.st

（切换黑白 firefox 和 webkit 以查看区别）

我为渐变和背景尺寸使用了所有正确的供应商前缀。

我在图像上修改了背景大小，它的行为符合预期。可能是特定于渐变的问题。

Answer 1

问题是，在 Firefox 中 background-size 有两个值，一个是宽度，一个是高度。如果你这样做：background-size: 400% firefox 将其转换为background-size: 400% auto。 auto 是高度的值。要修复它，只需编写： -moz-background-size: 400% 400% 这对我有用。