我有問題越來越箱陰影在IE10工作，我嘗試添加的box-shadow在IE 10不工作

@media screen and (min-width:0\0)

規則，但沒有成功。該代碼在firefox和chrome中效果很好。

代碼

.glossy-curved-black .slide-wrapper { 
    background-color: #FFF; 
    border: 10px solid #FFF; 
    box-shadow: 40px 40px 40px #000; 
    -webkit-box-shadow: 40px 40px 40px #000; 
    -moz-box-shadow: 40px 40px 40px #000; 
} 

    @media screen and (min-width:0\0) { 
    /* IE9 and IE10 rule sets go here */ 
     .glossy-curved-black .slide-wrapper { 
     box-shadow: 0px 0px 80px #000; 
     } 
    }

我的網站here

來源

2013-10-02 user2839101

有你正在嘗試使用不同的CSS的IE9和10理由嗎？此時，您應該對待所有瀏覽器。 – Mgetz

的問題是在你的腦袋元素：

<!-- Mimic Internet Explorer 7 --> 
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />

你迫使頁面到IE7模式下，如果你想對IE像一個現代的瀏覽器使用IE=EDGE代替。我測試了強制最新的渲染模式並顯示了陰影。

更新

每推薦由微軟，只是使用HTML5的doctype，避免發送文件兼容模式。瀏覽器檢測已被棄用，應儘量避免。改用功能檢測。默認模式是在標準模式下始終爲EDGE *。

<!doctype html>

*除了在web-browser control，在這種情況下，原稿模式必須明確要麼經由X-UA-Compatible頁眉或經由設置註冊表來EDGE。

來源

2013-10-02 15:12:15 Mgetz

謝謝您Mgetz是正確的位置！ – user2839101

沒有供應商名稱，主要CSS聲明應始終是最後一個。試試這個：

.glossy-curved-black .slide-wrapper { 
    background-color: #FFF; 
    border: 10px solid #FFF; 
    -webkit-box-shadow: 40px 40px 40px #000; 
    -moz-box-shadow: 40px 40px 40px #000; 
    -ms-box-shadow: 40px 40px 40px #000; 
    box-shadow: 40px 40px 40px #000; 
} 

@media screen and (min-width: 500px) { 
/* IE9 and IE10 rule sets go here */ 
    .glossy-curved-black .slide-wrapper { 
     -webkit-box-shadow: 0px 0px 80px #000; 
     -moz-box-shadow: 0px 0px 80px #000; 
     -ms-box-shadow: 0px 0px 80px #000; 
     box-shadow: 0px 0px 80px #000; 
    } 
}

我也注意到你的媒體查詢中有一個奇怪的最小寬度值。作爲你的例子，我已經把它設置爲500px。

來源

2013-10-02 15:06:43

奇最小寬度媒體查詢是靶向IE 9和10一劈：http://blog.keithclark.co.uk/moving-ie-specific-css-into-media-blocks/ – cimmanon

的box-shadow在IE 10不工作

回答

更新

相關問題