指定した順番の要素だけ変化させたい【css】

今回の記事では指定した順番の要素だけにcssを当てたい時に使うnth-childについて紹介いたします。

使う場面で例えると、ulタグで囲ってあるliタグの2番目の要素の色を変えたい…などです。

やり方

このようなulタグに囲われているliタグの2番目の要素の色を変えたいとします。

そこで

li:nth-child(2) { color: #575EFF; } と指定します。

すると・・・

このように2番目の要素の「テキスト2」だけ色を変えることができました。

コメントを残す

メールアドレスが公開されることはありません。 が付いている欄は必須項目です