tor-browser

The Tor Browser
git clone https://git.dasho.dev/tor-browser.git
Log | Files | Refs | README | LICENSE

highlight-painting-001.html (1207B)

      1 <!doctype html>
      2 <meta charset="utf-8">
      3 <title>CSS Pseudo-Elements Test: highlight painting</title>
      4 <link rel="author" name="Delan Azabani" href="mailto:dazabani@igalia.com">
      5 <link rel="help" href="https://drafts.csswg.org/css-pseudo-4/#highlight-painting">
      6 <link rel="help" href="https://drafts.csswg.org/css-text-decor-4/#painting">
      7 <link rel="help" href="https://www.w3.org/TR/CSS22/zindex.html#painting-order">
      8 <link rel="match" href="highlight-painting-001-ref.html">
      9 <meta name="assert" value="::selection overlay is painted in the correct order, including both the element’s shadows and the highlight’s shadows">
     10 <script src="support/selections.js"></script>
     11 <link rel="stylesheet" href="support/highlights.css">
     12 <style>
     13    p {
     14        font-size: 7em;
     15        text-shadow: 0.2500em 0.2500em #C0C000;
     16    }
     17    p::selection {
     18        background: #C0C0C0;
     19        text-shadow: 0.5000em 0.5000em #3838E0;
     20    }
     21 </style>
     22 <p class="highlight_reftest">quick
     23 <script>
     24    const target = document.querySelector("p");
     25    selectRangeWith(range => {
     26        range.selectNodeContents(target);
     27        range.setStart(target.childNodes[0], 1);
     28        range.setEnd(target.childNodes[0], 4);
     29    });
     30 </script>