top-level-parent-pseudo-specificity.html (651B)
1 <!DOCTYPE html> 2 <title>CSS Nesting: Specificity of top-level '&'</title> 3 <link rel="help" href="https://drafts.csswg.org/css-nesting-1"> 4 <link rel="help" href="https://github.com/w3c/csswg-drafts/issues/10196"> 5 <script src="/resources/testharness.js"></script> 6 <script src="/resources/testharnessreport.js"></script> 7 <style> 8 /* Note: at the top level, '&' matches like ':root'. */ 9 10 /* Should have zero specificity: */ 11 & { color: red; } 12 /* Should also have zero specificity: */ 13 :where(&) { color: green; } 14 </style> 15 <script> 16 test(() => { 17 assert_equals(getComputedStyle(document.documentElement).color, 'rgb(0, 128, 0)'); 18 }); 19 </script>