CSS漸變突然不能在IE9中工作

-1

由於某些原因，某些漸變在IE9上停止工作（就我所知，這就是它）。在我們的網站上應該有一個看起來像天空的背景漸變，並且在我們的主菜單導航大型下拉菜單中應該有一個藍色漸變，以便它與主導航欄中的懸停一起加入。CSS漸變突然不能在IE9中工作

網站的問題是：http://www.streetstyles4all.co.uk

任何一個可以建議？

奇怪的是，一些漸變實際上工作正常。我使用梯度發生器來創建一些漸變，但我對此很陌生，而且相當深入，它開始變得混亂。

在此先感謝

問候

羅布

來源

2013-05-28 SS4A

您可能希望更具體地瞭解哪些漸變看起來不能正常工作。例如，在Developer Tools中將IE設置爲IE8或IE7時，除了應該出現在菜單的鼠標懸停上的漸變背景之外，所有漸變看起來都可以像Firefox一樣工作。 –

background: #00b9ed; /* Old browsers */ 
background: -moz-linear-gradient(top, #00b9ed 0%, #f9fdff 100%); /* FF3.6+ */ 
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#00b9ed), color-stop(100%,#f9fdff)); /* Chrome,Safari4+ */ 
background: -webkit-linear-gradient(top, #00b9ed 0%,#f9fdff 100%); /* Chrome10+,Safari5.1+ */ 
background: -o-linear-gradient(top, #00b9ed 0%,#f9fdff 100%); /* Opera 11.10+ */ 
background: -ms-linear-gradient(top, #00b9ed 0%,#f9fdff 100%); /* IE10+ */ 
background: linear-gradient(to bottom, #00b9ed 0%,#f9fdff 100%); /* W3C */ 
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00b9ed', endColorstr='#f9fdff',GradientType=0); /* IE6-9 */

此代碼最適合在所有的瀏覽器，這裏是一個跨瀏覽器兼容，如果你在這個面對問題，不要讓我知道我會親自看到它。

來源

2013-05-28 13:09:51

從我所看到的，這是工作得很好。請檢查以確保您沒有在開發人員工具中將IE9設置爲某種其他瀏覽器類型。確保瀏覽器模式設置爲IE9，文檔模式設置爲IE9標準。

順便說一句，你的漸變背景沒有顯示在菜單項的鼠標懸停上的原因是因爲你在li上使用a：hover。 IE7和IE8不支持：將鼠標懸停在<a>標籤以外的任何元素上。只是稍微改變你的CSS樣式可能會糾正這個...

#general a:hover { 
    // your hover effect 
}

...將在所有版本的IE中支持。當然，你必須確保你的<a>標籤被調整爲顯示非懸停圖像，首先，你已經將<a>標籤設置爲display：block，這樣它可以顯示所有內容，但與嘗試獲取IE < 9支持：懸停在非錨點標記元素上。

來源

2013-05-28 13:12:46

CSS漸變突然不能在IE9中工作

回答

相關問題