タグ

ブックマーク / code-plus.jp (1)

  • よくある:first-child擬似クラスの間違い | CodePlus

    ul li:first-childとかでよく使用すると思われる、first-child擬似クラスですが、親要素の中の特定の最初の要素にかかるわけではありません。あくまで子要素の最初の要素です。dlを例に見て行きましょう。 first-childが効くのは最初の子要素 HTML <dl> <dt>タイトル</dd> <dd>説明</dd> </dl> CSS dl dd:first-child { font-weight:bold; } 上記のような例では、first-childは効きません。親であるdlの中のfirst-childはdtだからです。ddは最初の子要素ではないので、対象から外れます。 このようなパターンでCSSのみで完結させたいのであれば、隣接セレクタやCSS3のnth-childあたりを使って対応しましょう。

    mimimi0101
    mimimi0101 2013/02/04
    [:first-child]
  • 1