我想在其上方制作图案背景和白色到黑色（具有透明度）的渐变。如何解决它并使其跨浏览器工作？我从 Mozilla 开始，我尝试使用以下代码：
background: url(../images/bg_pattern.gif), -moz-linear-gradient( rgba(255, 255, 255, 0.5) 5%, rgba(130, 130, 130, 0.5) 95%
这当然行不通。那么如何解决呢？该代码将如何查找其他浏览器？ IE 是否支持多种背景和透明度？我认为不是，所以我会在您回答之前先问一下 - 如何为 IE 解决问题？
【问题讨论】：
标签： css transparency gradient background-image
您将需要两个独立的元素，一个覆盖另一个。顶部的元素听起来应该是您的渐变。仅供参考，这里是生成跨浏览器渐变的绝佳工具，本周刚刚在 An Event Apart 推出：
【讨论】：
试试这个：
background-image: url(images/pattern.png), -webkit-radial-gradient(0% 100%, rgb(20,150,254), rgb(119,117,174));
background-image: url(images/pattern.png), -moz-radial-gradient(0% 100%, rgb(20,150,254), rgb(119,117,174));
background-image: url(images/pattern.png), -ms-radial-gradient(0% 100%, rgb(20,150,254), rgb(119,117,174));
background-image: url(images/pattern.png), -o-radial-gradient(0% 100%, rgb(20,150,254), rgb(119,117,174));
background-image: url(images/pattern.png), radial-gradient(circle at 0% 100%, rgb(20,150,254), rgb(119,117,174));
【讨论】：
我有一个适用于除 IE 之外的所有东西的工作版本。 ：/我不记得我在哪里找到的，所以我不能给予适当的信任；但是，这里是：
背景：-webkit-linear-gradient(rgba(224,147,43,.9), rgba(224,147,43,.8)) 固定，#454040 url(images/grainy2.png) 重复固定； 背景：-ms-linear-gradient(rgba(224,147,43,.9), rgba(224,147,43,.95)) 固定，#454040 url(images/grainy2.png) 重复固定； 背景：-o-linear-gradient(rgba(224,147,43,.9), rgba(224,147,43,.95)) 固定，#454040 url(images/grainy2.png) 重复固定； 背景：-moz-linear-gradient(rgba(224,147,43,.9), rgba(224,147,43,.95)) 固定，#454040 url(images/grainy2.png) 重复固定；
第一种颜色是上衣，第二种是下装，第三种是图案上的颜色（不知道如何将其降低为透明）。最后直接指向你的模式。
我不完全确定 ms 的用途。就像我说的，我已经使用它大约几个月了，但我不记得来源了。我只是使用它们来确保它们工作。仍然无法修复 IE：/
【讨论】：