【19日目】ドットインストール「詳解CSSセレクター編」を終わらせた！

セレクター編は、奥が深そうでレッスンで覚えるというよりは、実践で「こんな使い方あったな」と思い出すのが大切なようです。

なので、セレクター編いったん終了しますが、自在に使えるようになったわけではないのです。。。

#01 CSSの基本セレクターを学んでいこう (01:40)

CSS記法の復習
基本セレクターの種類

#02 要素型セレクター､classセレクターを使おう (02:39)

要素型セレクター
classセレクター

#03 idセレクター､全称セレクターを使おう (02:08)

idセレクター
全称セレクター

#04 属性セレクターを使ってみよう (02:43)

属性セレクター
完全一致
前方一致
後方一致
部分一致

#05 セレクターを組み合わせてみよう (02:53)

セレクタの組み合わせ
a, b
ab
a > b
a b
a + b

#06 ::before､::after擬似要素を使おう (02:51)

::before
::after
カスタムデータ属性との併用

#07 :hover擬似クラスを使ってみよう (02:33)

擬似クラスと擬似要素の違い
:hover
cursor

#08 :nth-child擬似クラスを使おう (02:38)

:nth-child()
:first-child
:last-child

#09 :nth-of-type擬似クラスを使おう (02:35)

:nth-child()と:nth-of-type()の違い
:nth-of-type()
:first-of-type
:last-of-type

#10 :empty､:not擬似クラスを使おう (02:19)

:empty()
:not()

#11 詳細度を計算してみよう (02:49)

詳細度とは
詳細度の計算方法

#12 優先されるスタイルを確認しよう (02:24)

詳細度の挙動確認
style属性
!important