これまで作成したデモサイトのデザインをタブレットやスマホの画面でも最適化するためのレスポンシブデザインについて解説し、デモサイト上での実装を行っていきます。
※コードを用いた演習は「Visual Sutudio Code」を使用します。受講前にインストールをお願いします。ダウンロードページはコチラをご確認ください。
※サンプルコードとサンプル画像は事前に授業ページ上の「授業で使用する教材」からダウンロードをお願いします
■ 今回作成するデモサイト
https://kobayas.net/test/
※ユーザー名とパスワードは第一回の授業内で紹介しています。
■アジェンダ
1)レスポンシブデザインとは
2)ディベロッパーツールの使い方
3)レスポンシブ対応のコーディング
・ハンバーガーメニュー