我正在使用具有不透明度的渐变作为我的背景的亮度效果。现在它可以在 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 中不起作用?
提前致谢。