爲什麼我的CSS3媒體查詢沒有顯示在移動設備上？

我有一臺iPhone 4.我知道分辨率屬於我的風格參數。但是我在智能手機上看到了我的全角佈局。爲什麼我的CSS3媒體查詢沒有顯示在移動設備上？

我可以得到一雙清新的眼睛來查看來源，並讓我知道如果我失去了明顯的東西？它顯示在我的瀏覽器中，但不在設備上。

在我的HTML：

<meta name="viewport" content="width=device-width, initial-scale=1">

在我的CSS：

/* ---------------------------------------------------------------------- */ 
/* Media Queries 
/* ---------------------------------------------------------------------- */ 

//* Smaller than standard 960 (devices and browsers) */ 
@media only screen and (max-width:1000px) { 
} 

/* Tablet Portrait size to standard 960 (devices and browsers) */ 
@media only screen and (min-width:768px) and (max-width:1000px) { 
    body {padding:10px 4px; width:760px;} 
} 

/* All Mobile Sizes (devices and browser) */ 
@media only screen and (max-width:768px) { 
    html {background:#fff; padding:10px;} 
    body {box-shadow:none; margin:0; padding:0; width:auto;} 
    body > nav {display:none;} 
} 

/* Mobile Landscape Size to Tablet Portrait (devices and browsers) */ 
@media only screen and (min-width:480px) and (max-width:768px) { 
} 

/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */ 
@media only screen and (max-width:480px) { 
    .alpha, .omega {float:none;} 
    .alpha > * {margin:10px auto;} 
} 

/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */ 
@media only screen and (max-width:320px) { 
    footer div {float:none; width:auto;} 
}

編輯：簡化IT。

雖然我在這裏，任何人都有一個輕量級的策略來停用JS設備上的小標籤？

來源

2013-03-14 danfo

爲什麼不向我們提供您的媒體查詢，因此我們無需挖掘90％的無關代碼 – Adrift 2013-03-14 16:41:19

完成。對於那個很抱歉。 – danfo 2013-03-14 16:46:27

好的，雖然我沒有解決這個謎題，但我將移動樣式移動到了網站的其他部分，並且他們突然開始工作。我想我在mobile.css上有一些古怪的CSS特性，但是一旦我將媒體查詢移到了我的main.css中，一切都很好。

感謝您的幫助，所有。

來源

2013-04-01 14:16:19 danfo

我專門對我的媒體查詢定義0像素，例如：

@media only screen and (min-width:0px) and (max-width:1000px) 
{ 
    /* STYLES GO HERE */ 
}

也許這將有助於？

來源

2013-03-14 18:15:17 Lowkase

爲什麼我的CSS3媒體查詢沒有顯示在移動設備上？

回答

相關問題