スキルゼロ知識ゼロ経験ゼロからWeb制作で稼げる様になりたい！
6日目は練習から実践まで一気に行いました。
練習内容を忘れない様に時間を空けずに取り組んでみましたが、そんなに簡単ではなかったです。
画面サイズによってレイアウトが変わる重要な設定のため、内容を残しておきます。
忘れない様に1日でまとめて取り組む
初級中級を完了したところ、画像を見て完成させる実践風のレッスンがありました。
前日までにやったことを覚えていられなかったため、1日でまとめて実践までやってみました。
学習項目としては少なめですが、中級までの基礎ができないと応用できません。
レスポンシブデザイン
スマホやPC、タブレットなどいろんなデバイスで見た時に、画面サイズに合わせてレイアウトが変わる設定。
今の時代はもうデフォルトで設定する必要がありそうです。
メディアクエリ @media (max-width: xx) コードが@から始まる覚えづらそうなコード
box-sizing:border-box 余白を含めた幅でレイアウト調整ができます。「*」で全てに適用できます。
メニューバー fa-barsを使って表示できます。Font Awesomeのコードは覚える必要なし？
pxで設定していたサイズを、25％や50％を用いることで画面サイズの中で均等に配置することができる。
実践
実践はほぼテキストがありません。画像を見てコードを自分で考えて入力していきます。
タブレットやスマホ用のcssを別で用意しているのは、コードが多くなって大変だから分けているのでしょうか？
1日で練習から通して行いましたが、全くヒントや答えを見ずに制作することはできませんでした。
コード暗記→合いそうなコードを入力してみるの繰り返しで覚えるまでこなしていこうと思います。
まとめ
HTML＄CSS上級編を練習から実践まで1日でやってみました。
スマホで見ることが多い現代では必須のコードのため、使う機会は多くなりそうです。
内容自体は中級までの応用のため、新しく覚えることは多くないのですが、
問題文がないため、どのコードを使えばいいか浮かばないと手が止まってしまいます。
コード入力を習慣化して暗記できるように繰り返していきたいです。
コメント