MQでHTML/CSSをモバイル/タブレットに最適化

Question

モバイルとタブレットのホームページを適切な方法で最適化するという問題を抱えて、問題は、私は何の質問をするべきか確信していません。私のコードは完全には機能しません（私はそれをさらに下に提供します）が、私が与えたサンプルコードは私のコースの文献から取った特定の例のために非常に厳密に書かれています。したがって、私はそれを適用することに大きな問題があります。私は今何を変えるべきか、私は1ヶ月間試してきた。あなたが理解しているように初心者のプログラマー。

このような曖昧な質問は非常に残念です。これはむしろ私のプロジェクトで私を助ける時間を持っている人に手を差し伸べる試みです。先生は私を助けません。私はこの時点で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;} 

} 

Answer 1

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