Webやアプリのデザイントレンドを紹介。たまに雑談。

Browse By

[CSS3] Master of the :nth-child – nth-child() 疑似クラスの使い方と用例

  • Pocket
  • このエントリーをはてなブックマークに追加

CSS3で新たに定義されたnth-child擬似クラスの使い方と、「こう指定したらどうなるか」を詳しく解説したサイト。いやこれイイですよ、このためだけにドメインまで取得してますからね、イイですね。この「:nth-child()」という擬似クラス、簡単に言えば親要素の何番目に来る子要素かを指定してプロパティを適用するための方法です。けどこのカッコ内に入れる数字の指定方法にも色々あって、単純に「X」という数字を入れれば「X番目の」という意味になり、「n+X」と入れれば「X番目以降全ての」という意味になったりして、多機能なだけに難解な指定方法であったりもします。それらをコードと実際にレンダーされた画像とで分かりやすく解説してくれてます。ヘッダのベイダー卿も含めて色々とナイスです。

コメントを残す

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

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください