css寻找最近的项目

css
selector

2017-05-09 83 views 0 likes

我有一个包含相同元素的嵌套结构。只能作用于当前设定的目标范围内的元素我做这样的事：css寻找最近的项目

.set1 > .content > .trigger { 
    background: red; 
}

在现实生活中这个选择有更多的元素。虽然它起作用，但如果我更改其中一个元素的名称或深度，它将不再有效。

有没有办法找到当前集的.trigger（在这种情况下）？

<div class="set set1"> 
    <div class="content"> 
    <div class="trigger"></div> 
    <div class="set set2"> 
     <div class="content"> 
     <div class="trigger"></div> 
     </div> 
    <div> 
    </div> 
<div>

来源

2017-05-09 Jens Törnell

'.trigger'或全部一审'.trigger'？ – Swellar

你可以分享你试过的jQuery代码吗？ – SreenathPG

@Swellar触发器的第一个实例。 –

回答

您可以对所有触发器应用样式当前的一组内，然后删除第一个触发后到来的其它触发器的风格。

div { 
 
    padding: 5px; 
 
    border: 1px solid; 
 
} 
 

 
.set1 .trigger { 
 
    background: red; 
 
} 
 

 
.set1 .trigger ~ .set .trigger { 
 
    background: none; 
 
}

<div class="set set1"> 
 
    <div class="content"> 
 
    <div class="trigger"></div> 
 
    <div class="set set2"> 
 
     <div class="content"> 
 
     <div class="trigger"></div> 
 
     </div> 
 
    </div> 
 
    </div> 
 
</div>

来源

2017-05-09 07:39:26 Chiller

css寻找最近的项目

回答

相关问题