レスポンシブデザイン

まずレスポンシブデザインというのは、ユーザの画面の大きさに応じてUIのサイズが変更されるデザインのこと。

フレキシブルな画面作成

viewport

viewportとは画面の表示領域のこと。
ブラウザの表示領域がviewportとなる。

viewportの指定はhtml内のheadタグ内に記述する。

<meta name="viewport" content="width=device-width, initial-scale=1.0">