不同的屏幕大小和移動設備

寫作目前存在的css文件

我一直在試圖找出這個問題了一整天，還沒有得到它尚未：不同的屏幕大小和移動設備

我想有這3個CSS文件：

應該怎麼我的HTML看起來應當是desktop.css就像爲了獲得這個權利 - 使用媒體查詢或JavaScript。我經歷了很多時間，每次出現問題（桌面獲取mobile.css或iphone讀取Portrait.css，即使它處於橫向模式等）。

2011-11-28 Alon

開始：http://stuffandnonsense.co.uk/blog/about/hardboiled_css3_media_queries – motoxer4533

我知道<鏈接相對= 「樣式的」 href = 「handheld.css」媒體= 「手持」 />只針對手持設備，但如何區分這兩個iPhone手機會很難（必須是相同的操作系統，相同的瀏覽器等） – Fredy31

只記得 Eonasdan

也許Iphone的問題與已知的視口寬度問題有關？通過將其添加到html解決。

<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0" />

除了使用媒體查詢來調用css。並在CSS文件調用@import調用引用CSS文件（例如景觀將@import桌面等）

媒體查詢101：

<link href="css/phone.css" rel="stylesheet" type="text/css" 
media="only screen and (max-width: 400px)" >

和有關媒體的富國查詢here更多信息。

也勸使用條件IE意見隱藏從舊的IE瀏覽器的媒體查詢，讓它只使用一種CSS的

編輯：啊我現在明白了問題 - 你需要在不同的iPhone上使用不同的CSS情況..你可以使用jQuery的移動和綁定一個CSS類的變化，從肖像到風景和背部的變化。

希望這有助於在這裏

2011-11-28 19:01:13 alonisser

回答