Html 如何让渐变在firefox中工作

我正在制作一个具有梯度的导航条，如下所示：

/* Gradient backgrounds for the buttons. Generated using http://gradients.glrzad.com/ */
background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0, #b49931), color-stop(0.5, #5E5E5E), color-stop(0.51, #707070), color-stop(1, #838383));
background-image: -moz-linear-gradient(center bottom, #787878 0%, #5E5E5E 50%, #707070 51%, #838383 100%);
background-color:#5f5f5f; /* Fallback */

它在safari中非常有效，但在firefox中不起作用。我知道制作图像会更好，但是有没有简单的方法可以在firefox和safari中使用呢？

我制作了一个JSFIDLE

---

您可以使用Safari制作结果的屏幕截图，并将其裁剪成可重复的图像。

使用此工具。适用于所有浏览器

---

是否存在您在所有浏览器中都无法找到答案的问题？嗯，你可能想检查IE。在IE 7-9中，你必须使用扩展，例如，以使渐变工作。如果你甚至尝试加载你在IE中链接到的页面，它会告诉你它并不完全支持它。我说的是所有浏览器，不是所有浏览器的所有版本。