ハンバーガーメニューをタップすると、SPナビゲーションが表示する仕組みは「jQuery」を使って実装します。 初学者の方や、これからウェブデザインを始める方にとって、難しいかもしれませんが、わずか数行ですので諦めずにチャレンジしてみてください。 細切れにソースを見るのが面倒は人は、記事後半に全ソース載せてるので、そちらをご覧ください。 それではいきましょう スマホサイズでPCメニューを非表示にするメディアクエリでブレイクポイントを設定するいきなり難しい言葉が出てきましたが、心配いりません。 ブラウザの横幅が「何ピクセル以下」になったら「スマホ用のCSS」が効くようにするかを決めているだけです。 今回は、ブラウザの横幅が「640px以下」の時に、スマホ用のCSSを効くようにしたいので、次のように指定します。 コードは、前回記事の後半に記載してあるCSSの続きから書いてください。 @media
![固定ヘッダーをレスポンシブ化してスマホ対応する手順](https://cdn-ak-scissors.b.st-hatena.com/image/square/7d91327dca8024d03b4de23d4b9afc522ce7f669/height=288;version=1;width=512/https%3A%2F%2Frico-notes.com%2Fwp-content%2Fuploads%2F2020%2F03%2Fresp_header.jpg)