mobie優化佈局是否正確？

我想創建一個移動優化佈局，CSS和HTLM5。mobie優化佈局是否正確？

我加入這個代碼在底部的我的風格

@media only screen and (max-width: 480px) { 
    body { 
     padding: 5px; 
     background-color:#FFF; 
     background-image:url(images/smoothieworld_logo_mobile.jpg; 
     background-repeat:no-repeat; 
    } 
    #wrap { 
    with:auto; 
    margin-top:80px; 
    } 
    #masthead, sidebar { 
    display:none; 
    } 
    #mainnav { 
    height: auto; 
    } 
    #mainnav li { 
    float:none; 
    width: auto; 
    text-align:left; 
    border-top: 1px grey solid; 
    border-bottom: 1px grey solid; 
    } 
    #maincontent { 
    float: none; 
    width:auto; 
    background-color:white; 
    } 
    #footer, #footer p { 
    clear:none; 
    width:auto; 
    height:auto; 
    background-image:none; 
    padding-top:20px; 
    margin-top:0px; 
    } 
    }

，當我在我的瀏覽器Safari和Firefox這兩種預覽最新的這不起作用。

我加入下面的鏈接腳本到我的樣式，這樣

<link rel="stylesheet" media="screen" href="reset.css" type="text/css" /> 
    <link rel="stylesheet" media="screen" href="base.css" type="text/css" /> 
    <script scr="modernizer-2.6.2.js" type="text/javascript"></script>

它不正確預覽當我減少我的瀏覽器的寬度。

我做錯了什麼？任何人都可以幫忙嗎？

來源

2013-10-16 Robert Woods

將此添加到您的頭部。

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

來源

2013-10-16 10:59:21 Nitesh

mobie優化佈局是否正確？

回答

相關問題