0

我正在使用具有不透明度的渐变作为我的背景的亮度效果。现在它可以在 Chrome 和 Firefox 中运行,但在 IE10 中似乎不起作用,但我确实将 -ms- 版本放在那里。

这是我的 JSFiddle:>>>JSFiddle<<<

这是代码:

<div id="lol">

</div>

-

#lol {
    background-image:url('http://www.gettyimages.com/CMS/Pages/PhotoDiscFrontdoor/StaticContent/fd_image_test.jpg');
    width:700px;
    height:465px;
}

#lol:hover {
background: -moz-linear-gradient(top,  rgba(255,255,255,.1) 0%, rgba(255,255,255,.1) 100%), url('http://www.gettyimages.com/CMS/Pages/PhotoDiscFrontdoor/StaticContent/fd_image_test.jpg');
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,.1)), color-stop(100%,rgba(255,255,255,.1))), url('http://www.gettyimages.com/CMS/Pages/PhotoDiscFrontdoor/StaticContent/fd_image_test.jpg');
    background: -webkit-linear-gradient(top,  rgba(255,255,255,.1) 0%,rgba(255,255,255,.1) 100%), url('http://www.gettyimages.com/CMS/Pages/PhotoDiscFrontdoor/StaticContent/fd_image_test.jpg');
    background: -o-linear-gradient(top,  rgba(255,255,255,.1) 0%,rgba(255,255,255,.1) 100%), url('http://www.gettyimages.com/CMS/Pages/PhotoDiscFrontdoor/StaticContent/fd_image_test.jpg');
    background: -ms-linear-gradient(top,  rgba(255,255,255,.1) 0%,rgba(255,255,255,.1) 100%), url('http://www.gettyimages.com/CMS/Pages/PhotoDiscFrontdoor/StaticContent/fd_image_test.jpg');
    background: linear-gradient(to bottom,  rgba(255,255,255,.1) 0%,rgba(255,255,255,.1) 100%), url('http://www.gettyimages.com/CMS/Pages/PhotoDiscFrontdoor/StaticContent/fd_image_test.jpg');
}

有谁知道这段代码有什么问题?为什么它在 Internet Explorer 10 中不起作用?

提前致谢。

4

0 回答 0