檢測所有移動設備的屏幕寬度

當我使用Google Chrome瀏覽器選擇Galaxy S5（360px）進行模擬時，我在檢測正確的屏幕寬度時遇到問題。它省略了360px的CSS，並使用768px CSS代替。有沒有更好的方法呢？檢測所有移動設備的屏幕寬度

@media only screen and (max-device-width: 360px) 
{ 

    .header_2{width:100%;height:auto;padding:20px;} 
    .left_obj{width:290px; position:relative;float:left;margin-bottom:20px;} 
    .right_obj{width:290px; position:relative;float:left;} 
    .mini_header{margin-bottom:20px;} 

} 


@media only screen and (max-device-width: 768px) 
{ 

    .header_2{width:100%;height:auto;padding:20px;} 
    .left_obj{width:370px; position:relative;float:left;margin-bottom:20px;} 
    .right_obj{width:370px; position:relative;float:left;} 
    .mini_header{margin-bottom:20px;} 

}

來源

2016-06-13 Infinixd

媒體條件所有移動設備與景觀模式「@media唯一屏幕和（最大設備寬度：767px）」，使用寬度：x％ – Saika

解決方案只是設置順序作爲#MukeshRam的回答 –

就改變順序或媒體查詢的逆轉。寫第一個768媒體查詢，然後360.

來源

2016-06-13 06:59:05

您可以添加meta到您的標題。

<meta name="viewport" content="width=device-width">

您也可以參考此鏈接的全部細節 http://learn.shayhowe.com/advanced-html-css/responsive-web-design/

來源

2016-06-13 06:52:23 bxorcloud

檢測所有移動設備的屏幕寬度

回答

相關問題