CSS选择与特定的兄弟

Question

使用CMS生成如下：

<ul class="list-unstyled"> 
<li>content 1</li> 
<li>content 2</li> 
</ul> 
<ul class="list-unstyled"> 
<li> 
    <span>content 3</span> 
</li> 
<li> 
    <h2>content 4</h2> 
</li> 
</ul> 

我想CSS选择“内容4”。 有许多<ul>标签，其类别为“list-unstyled”。 有没有办法选择.list-unstyled > li > h2在李有兄弟姐妹li > span

这是使所必要的，我不选择不只是内容更加4.有一种可能性，即有在另一个地方，但没有兄弟姐妹li > span一个.list-unstyled > li > h2

希望我自己清楚

Answer 1

有没有办法选择.list-unstyled > li > h2在李有兄弟姐妹li > span

不，因为无法表达li在选择器中具有span子级以用于兄弟关系。请参阅Is there a CSS parent selector?

查看您是否可以改变CMS的输出，以某种方式为您的元素生成必要的类。

Answer 2

你的意思是这样

ul > li + li > h2{color:green}

<ul class="list-unstyled"> 
 
<li>content 1</li> 
 
<li>content 2</li> 
 
</ul> 
 
<ul class="list-unstyled"> 
 
<li> 
 
    <span>content 3</span> 
 
</li> 
 
<li> 
 
    <h2>content 4</h2> 
 
</li> 
 
</ul>

基本上CSS可以不看向上。

您可能想要查看javascript和dom元素属性，以获得基于条件测试的更加自定义的方法; ，但也许它更容易更改标记:)