nth-child-of-pseudo-class.html (884B)
1 <!doctype html> 2 <meta charset="utf-8"> 3 <title>CSS Selectors Invalidation: :nth-child(... of pseudo-class)</title> 4 <link rel="author" title="Zach Hoffman" href="mailto:zach@zrhoffman.net"> 5 <link rel="match" href="nth-child-of-pseudo-class-ref.html"> 6 <link rel="help" href="https://drafts.csswg.org/selectors-4/#child-index"> 7 <style> 8 p:nth-child(odd of :defined) { 9 color: green; 10 } 11 12 not-defined, my-element { 13 display: block; 14 margin-block: 1em; 15 margin-inline: 0; 16 } 17 </style> 18 <div> 19 <not-defined>Ignored</not-defined> 20 <not-defined>Ignored</not-defined> 21 <p>Not ignored</p> 22 <my-element>Selectively ignored</my-element> 23 <p>Not ignored</p> 24 <p>Not ignored</p> 25 <p>Not ignored</p> 26 <not-defined>Ignored</not-defined> 27 </div> 28 <script> 29 document.documentElement.offsetTop; 30 customElements.define("my-element", class MyElement extends HTMLElement{}); 31 </script>