通过CSS访问HTML内容？

Question

<div id=menu>
 <ul>
  <li class="section-title">auto-text1</li>
  <li class="section-title">auto-text2</li>
  <li class="section-title">auto-text3</li>
 </ul>
</div>

如何对auto-text3到css进行特殊处理？

Answer 1

见6.6.5.7节。 CSS3 - 未来 - 提案：

：last-child伪类

相同：nth-​​last-child（1）。 ：last-child伪类表示一个元素，它是某个其他元素的最后一个子元素。

ul > li:last-child { }

http://www.w3.org/TR/css3-selectors/#last-child-pseudo

（在您的示例中</menu>可能意味着结束</div>。）

暂时我觉得最好使用标记第一个和最后一个列表元素的类，或者#menu id上的简单Javascript。

Answer 2

您可以使用:nth-of-type() pseudo-class selector：

#menu > ul > li.section-title:nth-of-type(3)

这将使用类 section-title 选择所有li元素的第三个元素。

Answer 3

为了澄清其他答案，没有（当前）任何CSS选择器允许您根据其内容选择元素。