Get the last element in HTML structure
Question
Can I access the last div with the + content only with css & child combinators? I would like to style it.
<body>
<div>
<div>
<div>
<div>
<div>
<div>
<div>
<div>
<div>
<div>
+
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</body>
with:last child i can't reach so deep into the tree.
1 answers
solution1
3 2022-12-27 05:06:02
The selector div:(not(:has(div)) will match any DIV that doesn't have another DIV nested inside it.
:has(selector) matches an element whose contents include an element that matches selector . Putting this in :not() reverses the condition.
This is a relatively new CSS selector, and it's not yet supported by Firefox as of version 108. See the compatibility table .
div:not(:has(div)) { color: red; }
<body> a <div> b <div> c <div> d <div> e <div> f <div> g <div> h <div> i <div> j <div> + </div> </div> </div> </div> </div> </div> </div> </div> </div> </div>
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.