-本日のアジェンダ-
1限目
学科 CSS基礎⑥
CSSの記述【疑似クラス・疑似要素】
2限目
学科 CSS基礎⑥
CSSの記述【リスト】CSSの記述【表】
3限目
学科 CSS基礎⑥
その他のCSSについて
4限目
学科 CSS基礎⑥
CSSのまとめ
5限目
学科 CSS基礎⑥
グラフィックツールの復習
本日のテーマ
CSSはその他にもいろいろあります。
疑似クラス・疑似要素 について
擬似クラスとは … 擬似クラスとは指定の要素が特定の状態である場合にスタイルを適用させるセレクタです。 文章構造の範囲外にある情報によってスタイルを変化させることができます。
擬似要素とは、要素の一部に対してスタイルを適用できる指定方法です。 HTMLの要素を擬似的にCSSで設定するので、コーディングに手を加えることなく装飾を適用することができます。
ワンポイントアドバイス
疑似クラス・疑似要素はここまで学んだ基本的なCSSを更に効果的に使う為の技術です。ここまで学んだ内容を復習しながら使うと良いでしょう。
参考サイト
リスト や 表 について
リスト項目やテーブル(表)のHTMLのタグに対して、それぞれのCSSがあります。文法と見た目の特徴に合わせて上手に使っていきましょう。
参考サイト
- CSSで作るリストデザイン38選!オシャレな箇条書きを実現
- CSSで表を見やすく美しく! テーブルのデザインを調整しよう …
- 【CSS】tableタグを使わず、ul, liのみで表を作成する – みたぬ …
様々なCSSについて
ここまで学んだCSS以外にも様々なCSSがあります。また新しいものも出てきます。ただしブラウザによって使えるタグが異なったり、デバイス依存もあります。OSにも影響もあります。日々変わる業界の動向にアンテナを張っていきましょう。
ワンポイントアドバイス
まずはこれまで学んだCSSをしっかりと覚えてまずは、「知る」次に「使う」そしてお仕事で「使いこなす」を目指しましょう。
コツとしては、「自分なりにまとめる」をしっかりと定期的に行うと良いでしょう。
参考サイト
本日の課題①
wordpressのサイトに、本日学んだ内容を「投稿ページ」にまとめてください。
投稿日は、本日の日時で設定してください。
※ページタイトルに「議題」は必ず入れましょう。
本日の課題②
グラフィックデザイン基礎の内容をページにまとめてください。
投稿日は、該当する「学科 グラフィックデザイン基礎」の日時にしてください。
※ページタイトルに「議題」は必ず入れましょう。