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 或其他魔法 ( < ) 东西，有没有办法让它更优雅？

Answer 1

您可以在 CSS 中使用 :first-child 来完成它伪元素:

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

(要使 :first-child 在 IE8 及更早版本中工作，必须声明 <!DOCTYPE>。)

或者像 Lohn Smith 用 jQuery 做的那样:

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

一个简单的example at jsFiddle