爲移動設備包含CSS樣式的最佳方法？

目前爲Web應用程序我有使用 layout.css中 layout_medium.css對平板電腦的 layout_narrow.css的電話設備爲移動設備包含CSS樣式的最佳方法？

試驗A的結構：

<link type="text/css" rel="stylesheet" href="/project/assets/css/layout.css" /> 
<link type="text/css" rel="stylesheet" href="/project/assets/css/layout_medium.css" media="only screen and (min-width: 481px) and (max-width: 999px)" /> 
<link type="text/css" rel="stylesheet" href="/project/assets/css/layout_narrow.css media="only screen and (max-width: 480px)" />

試驗B 上layout.css我包含零件

@import url('layout_medium.css') screen and (min-width: 481px) and (max-width:999px); 
@import url('layout_narrow.css') screen and (max-width:480px);

測試B適用於Chrome和Firefox的桌面，但不適用於手機

測試A將始終工作，但然後它混亂了我的頭部區域，這對我來說似乎更加骯髒。

所以問題是：測試B不適用於手機的技術原因是什麼？

來源

2011-01-28 Josh Knutson

我認爲最好的背景是這個非常好的quirksmode article series，它解釋了移動上的視口與桌面的不同之處。仔細讀！

來源

2011-01-28 15:59:15

爲移動設備包含CSS樣式的最佳方法？

回答

相關問題