html - DIV 内で DIV のクラスを定義するより洗練された方法

Question

これを見てみましょう：

<div class="login_container">
  <div>Log in:</div>
  <div>Username:</div>
  <div>Jelszó:</div>
</div>

「ログイン」テキストに別のクラスが必要です。通常、私はこれを行います：

<div class="login_container">
  <div class="textCenter login_container_title">Log in:</div>
  <div>Username:</div>
  <div>Jelszó:</div>
</div>

しかし、それは少し複雑になります。CSS の :first または別の魔法 ( < ) について聞いたことがありますが、よりエレガントにする方法はありますか?

score 2 · Accepted Answer

簡単に使用できます

.login_container > div:first-child {}

これはjQueryよりも効率的です

score 2 · Accepted Answer

:first-child疑似要素を使用してCSSで行うことができます：

.login_container > div:first-child {color:#f00}

( :first-childIE8 以前で動作させるには、 a<!DOCTYPE>を宣言する必要があります。)

または、Lohn Smith が jQuery で行うように:

$('.login_container div:first').addClass('highlight');

jsFiddleの簡単な例

score 2 · Accepted Answer

jQuery を使用して、login_container div の最初の要素にクラスを追加できます。

jQuery("div#login_container div:first").addClass("myClass");

3 に答える 3