css - クラス名でメディア クエリを使用して Web サイトの幅を変更する

Question

全画面表示にしたいモバイルアプリケーションがあります。Twitter Bootstrap は、携帯電話、タブレット、その他すべての情報のサイズを教えてくれます。さまざまな種類のサイズをすべて処理する CSS クラスが必要です。私はこのようなものを探しています:

@media (max-width: 480px) classname

@media (max-width: 767px) classname

等

Answer 1

このようなもの？

@media (max-width: 767px) {
  .classname {
    width: 80%;
  }
}

@media (max-width: 480px) {
  .classname {
    width:100%;
  }
}

小さい方のメディア クエリmax-widthは最後に設定され、大きい方のメディア クエリを上書きできることに注意してくださいmax-width。

メディア クエリの使用の詳細については、この記事を参照してください。