具有特定类别的元素的选择器，如果它是一个和一个元素。只有其父母的孩子？

Question

如果是 one＆amp;父母中唯一的孩子。我可以使用jQuery轻松完成此操作，但我正在寻找一个纯CSS解决方案（适用于所有主流浏览器）。如何为这些元素编写选择器表达式？

E.g。情形：

<div> 
   <span class='a1'/>
</div>

<div> 
   <a>random text</a>
   <span class='a1'/>
</div>

我希望第一个div包含.a1元素，因为它是其父元素中的唯一元素。

Answer 1

试试这个以实现跨浏览器兼容性，

.a1:first-child:last-child {
     color :red;
}

DEMO

Answer 2

使用.a1:only-child，请参阅this fiddle。当然，这取决于你认为“主要浏览器”是什么supported or not（它是CSS3属性）。