CSS选择器,查找嵌套内容中的第一个出现
我尝试了一些不同的方法,以使第一个元素将其Display属性设置为Block,其余元素应设置为None。但我不能只获得元素的第一次出现,每次我使用选择器时,我都会获得所有元素或一个元素都没有。也许你们中的一些人知道一些解决我问题的css技巧。
以下是我的代码:
<div class="some_class">
<p>...</p>
<p>...</p>
<p> <object height="300" width="480"></object></p>
<p> <object height="300" width="480"></object></p>
<p> <object height="300" width="480"></object></p>
<p>...</p></div>
我需要获取"Object"的第一次出现。我不能更改HTML,我必须找到一种方法来解决这个问题,方法是使用一个很好的CSS选择器。有谁有主意吗?
我尝试了如下代码:.some_class p > object:first-of-type
但这样一来,每个"对象"都会被选中。因为每个"对象"都是其父"p"类型的第一个。
解决方案
注意:这仅在元素是静态的、可以更改的情况下才有效nth-of-type()
用于p
,但如果元素是动态的,则需要 选择JavaScript
试试
.some_class p:nth-of-type(1) object {
/* Styles goes here */
}
这将选择p
元素中的所有对象,如果p中只有一个对象元素,请使用此选项,如果您有多个对象元素,请使用此选项
.some_class p:nth-of-type(1) object:nth-of-type(1) {
/* Styles goes here */
}
相关文章