-本日のアジェンダ-
1限目
学科 CSS基礎⑦
はみ出した領域の表示について
2限目
学科 CSS基礎⑦
文字の折り返しについて
3限目
学科 CSS基礎⑦
テキストの回り込みについて
4限目
学科 CSS基礎⑦
CSSのまとめ
5限目
学科 CSS基礎⑦
過去の訓練の復習
本日のテーマ
文書レイアウトを制御しましょう
はみ出した領域の表示について
- overflowプロパティ
overflowは、これまでのタグでも注意は必要でしたが、特に気を付ける事としてブラウザ依存する(ブラウザ毎にデザインが異なる)という点に注意しましょう。
参考サイト
- overflow-CSSリファレンス – HTMLクイックリファレンス
- 【CSS】overflowの使い方:hiddenやscrollの違いは?
- 【CSS】overflow徹底攻略!scrollやhiddenなどの使い方も解説
文字の折り返しについて
- overflow-wrap(文章が領域の端に来た時に、単語の途中で改行するかどうかの設定)
- word-break(長い単語が領域の端に来た時に、単語の途中で改行するかどうかの設定)
参考サイト
テキストの回り込みについて
- floatプロパティ
- shape-outsideプロパティ
参考サイト
本日の課題①
WordPressサイトに、本日学んだ内容を「投稿ページ」にまとめてください。
投稿日は、本日の日時で設定してください。
※ページタイトルは、投稿内容がわかるような記述にしましょう。
本日の課題②
過去の訓練の復習として訓練内容を「投稿ページ」にまとめてください。
投稿日は、該当する訓練の日時にしてください。
※ページタイトルは、投稿内容がわかるような記述にしましょう。