custom-highlight-painting-inheritance-002.html (881B)
1 <!DOCTYPE html> 2 <meta charset="UTF-8"> 3 <title>CSS Highlight API Test: Inheritance</title> 4 <link rel="help" href="https://drafts.csswg.org/css-highlight-api-1/"> 5 <link rel="match" href="custom-highlight-painting-inheritance-001-ref.html"> 6 <meta name="assert" value="Highlighted elements inherit style properties from their parent even if there's not a ::highlight selector directly applying to them or their parent."> 7 <style> 8 div::highlight(div-highlight) { 9 background-color: green; 10 } 11 </style> 12 <body> 13 <div>There should be only one green rectangle below from [ to ]:</div> 14 <div id="target">[<span> <strong> </strong> </span>]</div> 15 <script> 16 const node = document.getElementById("target"); 17 let r = new Range(); 18 r.setStart(node, 1); 19 r.setEnd(node, 2); 20 CSS.highlights.set("div-highlight", new Highlight(r)); 21 </script>