デスクトップではなくモバイルで画面の100％を占めるメニュー？

Question

これはWebデザインの一般的な質問です。

アクティブにすると、デスクトップ画面の幅の25％、モバイル画面の幅の100％を占めるハンバーガーメニューを作成したかったとします。

これはどのように達成できますか？

Answer 1

使用media queries

ので、例えば

.menu { 
    width: 100%; 
} 

@media (min-width: 500px) { 
    .menu { 
     width: 25%; 
    } 
} 

このコードは、あなたのスクリーンが、その場合には、少なくとも500pxなど広い場合を除き、クラス menuを持つ要素は、幅が100％になることを意味します

幅は25％になります。