移動/平板電腦優化爲HTML/CSS與MQ

我被困在課程任務與優化我的手機和平板電腦的主頁以正確的方式的問題。問題是我甚至不確定要問什麼問題。我知道我的代碼並沒有完全工作（爲了以防萬一，我會進一步提供它），但我給出的示例代碼非常嚴格地寫入了一個特定示例，取自我的課程文獻。因此，我應用它有很大的問題。我現在不是真的要改變什麼，我一直在嘗試一個月。初學者程序員，你可能會明白。移動/平板電腦優化爲HTML/CSS與MQ

我很抱歉問這樣一個模糊的問題;這是一個嘗試接觸有時間幫助我完成項目的人。我的老師不會幫助我，我想我已經閱讀了Google上的所有內容。我知道我正在接觸。

預先感謝您。

MQ代碼（如果它確實幫助）：

/*MQ Mobile*/ 
@media only screen and (max-width: 1024px) { 
    html, body {  
    margin:0; /* remove default margin */ 
    padding:0; /* remove default padding */ 
    width: auto; 
} 
    #content { width: auto;} 
    #text { width: auto;} 
    main { margin-left: 0; width: auto; } 
    aside {display: none; } 
    nav li {display: inline-block; padding: 0.5em;} 
    nav ul { text-align: center; } 
    nav a { border-style: none;} 
    h1 { font-size: 120%;} 
    p {font-size: 90%} 

} 

@media only screen and (max-width: 768px) { 
    html, body {  
    margin:0; /* remove default margin */ 
    padding:0; /* remove default padding */ 
    width: auto; 
} 
    h1 {font-size: 100%;} 
    p { font-size: 120%; } 
    figure { display: none; } 
    nav, nav ul, nav li { padding: 0.1em; font-size:90%; } 
    nav li {display: block;} 
    nav a { display: block; padding: 0.5em 0; border-bottom: none;} 

}

來源

2016-10-19 MrBlubbintosh

@media screen and (min-width: 479px) and (max-width: 1024px){ /* your css between 1024px until for example 479px */}

來源

2016-10-19 09:22:36 WordpressLars

我不明白。你想讓我把它放在哪裏？第一臺mq是爲平板電腦製造的，第二臺適用於移動設備。 – MrBlubbintosh

雖然此代碼片段可能會解決問題，但[包括解釋]（http://meta.stackexchange.com/questions/114762/explaining-entirely-code-based-answers）確實有助於提高帖子的質量。請記住，您將來會爲讀者回答問題，而這些人可能不知道您的代碼建議的原因。 – andreas

移動/平板電腦優化爲HTML/CSS與MQ

回答

相關問題