viewport　width: 100%　viewportの設定方法【Progate】

レスポンシブデザインの実装

vviewportviewportviewportviewportviewportviewportviewportviewport

・設置場所は<head>タグ内に設置する

こう覚える

表題にある通り。画像の大きさを、スマートフォンにも均一にするため。

・viewpointの設定を実行できる

・CSSに対し、全要素を適用できるようにする

-border-sizingからborder-boxへ変更できるよう調整

・widthの値を１００％に設定すること。スマートフォン枠内に画像を収めるように調整する

vviewportよりも下の行viewportよりも下の行viewportよりも下の行wportvi

・CSS内の画像要素（％）を変更することで、画面内の大きさを均等かつみやすくする

・２列にすることで画像を均等に配置。かつ、見やすくするためのレイアウト設定する

・responsive.cssの記述方法と配置場所を覚える

<link rel="stylesheet" href="responsive.css">

これで「タブレット向けのレイアウトを作ってみよう」クリア。

・セミコロン；付け忘れ

その他特に問題なし。上記までを復習・反復し、タブレット調整できるようにする。