IE11中另一个背景图像上的线性渐变背景图像答案

【问题标题】：Linear gradient background image over another background image in IE11IE11中另一个背景图像上的线性渐变背景图像
【发布时间】：2018-05-24 17:15:03
【问题描述】：

我正在尝试找到一个允许两个背景图像的跨浏览器解决方案 - 一个覆盖在背景图像上的线性渐变。

这需要在 Internet Explorer 11 中运行。

我在这个场合使用内联样式 - 目前我有：

<div id="the_big_picture" class="row section second_section" style="background-image: linear-gradient(180deg,#ffffff00 80%,#fffffffc 90%), url('img/the_big_picture_bg.jpg')"></div>

以上在 Chrome、Firefox 和 Safari 中运行良好，但 IE11 不想玩球。

提前致谢。

【问题讨论】：

stackoverflow.com/questions/19980079/…的可能重复
@NanditaAroraSharma 是的，我确实读过那篇文章 - 但是，我已经尝试了相同的代码，但它在我的情况下不起作用！该示例中的代码是相反的顺序，当反转以适合我的用例时，它不会产生所需的结果......

标签： css

【解决方案1】：

尝试使用其他颜色。这个有效

linear-gradient(180deg, transparent 80%, #fff 90%), url('img/the_big_picture_bg.png')

【讨论】：