tor-browser

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

marker-content-020.html (1999B)


      1 <!DOCTYPE html>
      2 <html class="reftest-wait">
      3 <meta charset="utf-8">
      4 <title>CSS Test: ::marker pseudo elements styled with 'content' property</title>
      5 <link rel="author" title="Oriol Brufau" href="mailto:obrufau@igalia.com">
      6 <link rel="match" href="marker-content-020-ref.html">
      7 <link rel="help" href="https://drafts.csswg.org/css-pseudo-4/#marker-pseudo">
      8 <link rel="help" href="https://drafts.csswg.org/css-content/#content-property">
      9 <meta name="assert" content="Checks that the ::marker is updated when 'content: none' is applied or unapplied dynamically.">
     10 <style>
     11 .no-marker ::marker {
     12  content: none;
     13 }
     14 .inside {
     15  list-style-position: inside;
     16 }
     17 .symbol {
     18  list-style-type: disc;
     19 }
     20 .decimal {
     21  list-style-type: decimal;
     22 }
     23 .string {
     24  list-style-type: "string";
     25 }
     26 .image {
     27  list-style-image: url("/images/green-100x50.png");
     28 }
     29 </style>
     30 <div class="no-marker">
     31  <ol class="inside">
     32    <li class="symbol">inside symbol</li>
     33    <li class="decimal">inside decimal</li>
     34    <li class="string">inside string</li>
     35    <li class="image">inside image</li>
     36  </ol>
     37  <ol class="outside">
     38    <li class="symbol">outside symbol</li>
     39    <li class="decimal">outside decimal</li>
     40    <li class="string">outside string</li>
     41    <li class="image">outside image</li>
     42  </ol>
     43 </div>
     44 <div>
     45  <ol class="inside">
     46    <li class="symbol">inside symbol</li>
     47    <li class="decimal">inside decimal</li>
     48    <li class="string">inside string</li>
     49    <li class="image">inside image</li>
     50  </ol>
     51  <ol class="outside">
     52    <li class="symbol">outside symbol</li>
     53    <li class="decimal">outside decimal</li>
     54    <li class="string">outside string</li>
     55    <li class="image">outside image</li>
     56  </ol>
     57 </div>
     58 <script src="/common/reftest-wait.js"></script>
     59 <script>
     60 "use strict";
     61 addEventListener("load", function() {
     62  requestAnimationFrame(() => {
     63    for (const div of document.querySelectorAll("div")) {
     64      div.classList.toggle("no-marker");
     65    }
     66    takeScreenshot();
     67  });
     68 }, {once: true});
     69 </script>
     70 </html>