CSS特定类的第一个孩子

Question

我有以下HTML代码:

<span class="ui-icon ui-icon-triangle-1-s"></span>
<span class="route-line">4</span>
<span class="route-line">33</span>

我想补充的一些风格首先 span用class="route-line".CSS有可能吗？它是这样的nth-of-type; 如果它已经存在,它就会被召唤nth-of-type-with-class.

谢谢!

Answer 1

在这种情况下,您可以使用兄弟选择器.像这样:

.ui-icon + .route-line{
    color: red;
}

它将仅span使用类来跟随元素后面的样式ui-icon.

Answer 2

第一个包含.route-line类的跨度，后面是任何其他没有.route-line类的元素

*:not(.route-line) + span.route-line
{
    background-color:yellow;
}