tor-browser

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

hiragana-katakana-kerning.html (1385B)

      1 <!DOCTYPE html>
      2 <html>
      3  <head>
      4    <meta charset="UTF-8" />
      5    <title>CSS Test: Hiragana/Katakana kerning</title>
      6    <link rel="author" title="Jonathan Kew" href="mailto:jkew@mozilla.com">
      7    <!-- Based on testcase by Harry Dalton, see https://bugzilla.mozilla.org/show_bug.cgi?id=1811471;
      8         check that kerning works between hiragana and katakana, because both map to the same
      9         OpenType script behavior. -->
     10    <link rel="mismatch" href="hiragana-katakana-kerning-notref.html">
     11    <link rel="help" href="https://learn.microsoft.com/en-us/typography/opentype/spec/scripttags">
     12    <style>
     13      @font-face {
     14        font-family: "Noto Sans JP";
     15        src: url(resources/NotoSansJP-kana_test-subset.otf);
     16      }
     17 
     18      p {
     19        position: absolute;
     20        top: 0;
     21        left: 0;
     22 
     23        font-size: 6em;
     24        font-family: "Noto Sans JP";
     25        font-feature-settings: "palt" on;
     26 
     27        margin: 1em;
     28      }
     29 
     30      .with-kerning {
     31        font-kerning: normal;
     32        color: red;
     33      }
     34 
     35      .no-kerning {
     36        font-kerning: none;
     37        color: green;
     38        mix-blend-mode: multiply;
     39      }
     40    </style>
     41  </head>
     42  <body>
     43    <span>
     44      RED or GREEN text is visible if kerning is applying correctly, with only
     45      BLACK otherwise:
     46    </span>
     47    <p class="with-kerning">すペ</p>
     48    <p class="no-kerning">すペ</p>
     49  </body>
     50 </html>