CSS媒體查詢在IE中不起作用9

我在設計中包含了一些媒體查詢，以根據瀏覽器寬度更改頁面某些元素的寬度。查詢如下：CSS媒體查詢在IE中不起作用9

@media screen and (min-width:1024px) 
@media screen and (max-width:1024px)

Chrome，Safari和Firefox工作得很好，只有IE是一個問題。我知道，IE 9之前的所有版本都不支持此功能，但它們根本不適用於IE 9。可能是什麼問題？

來源

2011-08-02 Sacha

您是否打開了兼容模式？

來源

2011-08-02 19:49:07

兼容模式已打開。關掉解決了這個問題。非常感謝你。 – Sacha

謝謝這也解決了我的問題...以爲我會提及的情況下，它可以幫助其他人在我的IE9下的「兼容性視圖設置」它有「顯示Intranet站點兼容性視圖」選項打勾，這似乎是預設???這是影響從我的WAMP服務器服務的網站 – byronyasgur

兼容性模式在IE9上的默認模式？ –

-6

不幸的是，任何版本的IE都不支持min-width。所以，如果你使用這個約定：

<!--- CSS Selector :: Desktop ---> 
<link rel="stylesheet" type="text/css" href="css/desktop.css" media="screen and (min-width:960px)" label="desktop"> 

<!--- CSS Selector :: Tablet PC ---> 
<link rel="stylesheet" type="text/css" href="css/tablet.css" media="screen and (min-width:768px) and (max-width:959px)" label="tablet"> 

<!--- CSS Selector :: Phone ---> 
<link rel="stylesheet" type="text/css" href="css/phone.css" media="screen and (min-width:320px) and (max-width:499px)" label="phone">

它會忽略所有。

Reference。

來源

2011-11-27 11:54:12

如果您提供瞭解決方法，這將會很有幫助。根據你的'參考'鏈接，IE 7-9都支持'min-width'。 – Amy

確保您有正確的DOCTYPE聲明。它強烈建議網站爲了支持最廣泛的成熟和新興的標準（在這種情況下：CSS3）使用HTML5文檔類型，以及Web瀏覽器的最廣泛的範圍：<!DOCTYPE html>

來源

2012-08-07 22:36:59

使用下列條件

@media only screen (min-width: 1px) and (max-width:599px)

，而不是

@media only screen (max-width:599px)

，並確保min-width是1px爲IE9不皮卡0px

來源

2015-10-21 19:40:56 Sameh

CSS媒體查詢在IE中不起作用9

回答

相關問題