CSS：线性渐变背景颜色不适用答案

【问题标题】：CSS: Linear gradient background colours not applyingCSS：线性渐变背景颜色不适用
【发布时间】：2019-06-27 04:20:31
【问题描述】：

线性渐变颜色是否适用于所有浏览器？我面临的问题是，线性渐变颜色（黑色和灰色）在 Outlook 和 gmail 中工作正常，但在网络邮件和移动设备中不起作用。如何摆脱这个问题？谢谢

【问题讨论】：

改用图片

标签： css linear-gradients webmail

【解决方案1】：

这取决于您如何编写 css。最好给所有浏览器前缀，以便它适用于所有浏览器。比如这样的

background-image:     -webkit-linear-gradient(right, #0c93C0, #FFF); 
background-image:      -moz-linear-gradient(right, #0c93C0, #FFF);
background-image:     -ms-linear-gradient(right, #0c93C0, #FFF); 
background-image:      -o-linear-gradient(right, #0c93C0, #FFF);
background-image:      linear-gradient(right, #0c93C0, #FFF);

对于低于 IE10 的 Internet Explorer 版本，您应该像这样使用它：

/*IE7-*/ filter: progid:DXImageTransform.Microsoft.Gradient(startColorStr='#0c93c0', endColorStr='#FFFFFF', GradientType=0);
/*IE8+*/ -ms-filter: "progid:DXImageTransform.Microsoft.Gradient(startColorStr='#0c93c0', endColorStr='#FFFFFF', GradientType=0)";

另外在你使用之前，我建议你看看它是否兼容不同的浏览器版本：https://caniuse.com/#search=linear-gradient

【讨论】：