0

我不确定这是否可能，但我想我会问。我不想为我在父项下的所有元素提供 id，我想知道在 CSS 中是否可以引用它们中的每一个而不给它们一个 id。

如果我有：

  <td id="bracket-wrapper-lt">
    <div id="bracket-top-lt"></div>
    <div id="bracket-middle-lt"></div>
    <div id="bracket-bottom-lt"></div>
  </td>

我可以访问下面bracket-wrapper-lt给我的三个 div

  <td id="bracket-wrapper-lt">
    <div></div>
    <div></div>
    <div></div>
  </td>
4

3 回答 3

1

你可以，使用:nth-child(<number>)css。

有关详细信息，请参阅http://css-tricks.com/how-nth-child-works/。

您的代码示例：

  <td id="bracket-wrapper-lt">
    <div></div>
    <div></div>
    <div></div>
  </td>

CSS：

td#bracket-wrapper-lt div:nth-child(1) {
    color: red;
}

以上会将您的第一个 div 中的文本着色为红色。

于 2012-12-26T10:09:19.797 回答
0

是的，您可以使用以下方式访问它：

#bracket-wrapper-lt div

匹配所有后代（具有指定的标签、类等）和

#brakect-wrapper-lt > div

匹配所有子项（具有指定的标签、类等）

你可以在这里阅读更多关于它的信息

于 2012-12-26T10:11:05.103 回答
0

对于跨浏览器支持，您还可以使用：

#bracket-wrapper-lt > div:first-child { /*Style goes here*/ }
#bracket-wrapper-lt > div:first-child + div { /*Style goes here*/ }
#bracket-wrapper-lt > div:first-child + div + div { /*Style goes here*/ }

演示：http: //jsfiddle.net/sfEDk/

它适用于 IE(>=7)、Firefox、Chrome、Safari 和 Opera

于 2012-12-26T10:23:27.450 回答