動画で練習30

参考ブログ

初心者でもわかるHTML&CSS講座　イタリアンレストランホームページを作る | Inoma Createｋ

※ブログ内に練習用のデータあり

－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－

スマホのレイアウト

・コンセプトロゴ「#concept_logo」

・横幅「width」を「70%」に縮小

・全体の見出しの大きさ「#concept h2」を縮小する「font-size: 1.5em;」

・アイコンも大きすぎるので「#concept_icon」を「width: 70%;」に縮小

・コンセプトの文字「#concept p」をスマホ様に縮小「font-size: 0.8em;」

－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－

コード

↑メインの情報をスマホ様に設定

ブラウザ

↑適用前

↑適用後、画像と文字が縮小されました。

※続きます。