メディアクエリ画面を変更するにはどうすればよいですか？

Question

小さい幅を見ると、元のデスクトップサイズとすべてになりますが、メディアクエリを使用するとデスクトップサイズが別のサイズに変更されます。元のサイズがデスクトップに戻って小さくなり、幅が同じになるようにするにはどうすればよいですか？メディアクエリを更新すると、元のデスクトップビューが変更されます。

  .container{ 
       width: 960px; 
       margin: 0px auto; 
      } 
      @media (min-width: 430px){ 
      .container { width:960px; margin: 0px auto;} 
      } 

Answer 1

あなたの現在のコードは言う：ブラウザウィンドウが430pxよりも広い場合、コンテナ、ブラウザウィンドウが960ピクセル幅より狭い場合引き起こし、ナンセンスである（既存のコンテナのルールを上書きして960ピクセル幅にコンテナの幅を設定します幅広くなり、水平スクロールが発生します）。同時に、ウィンドウが430pxより狭い場合、コンテナーのルールに従ってコンテナーも960pxになります。 430px以下のウィンドウの幅を100％と初期のコンテナの幅を設定し

.container { 
    width: 100%; 
    margin: 0; 
} 

@media only screen and (min-width: 430px) { 
    .container { 
    width: 400px; 
    margin: 0 auto; 
    } 
} 

@media only screen and (min-width: 1000px) { 
    .container { 
    width: 960px; 
    } 
} 

上記のスタイル：あなたはおそらくやりたいことは、このようなものです。ウィンドウの幅が1000pxよりも広い場合、コンテナのサイズは400pxに設定され、中央に配置されます。最後にウィンドウが1000pxと等しいか幅が広い場合、コンテナの幅は960pxに設定されます（幅を400pxに設定するルールをオーバーライドしますが、余白ルールをオーバーライドしていないことに注意してください。ウィンドウが430pxより広いので、メディアクエリが適用されます