tor-browser

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

font-face-stretch-auto-variable-ref.html (1449B)


      1 <!DOCTYPE html>
      2 <html lang="en">
      3 <meta charset="utf-8"/>
      4 <title>CSS Test: Support for font-stretch: auto in @font-face</title>
      5 <style>
      6    @font-face {
      7        font-family: "Roboto";
      8        src: url('support/fonts/RobotoExtremo-VF.subset.ttf') format('truetype');
      9        font-display: swap;
     10        font-style: normal;
     11        font-stretch: 75% 125%;
     12    }
     13    .stretch50 {
     14        font-family: "Roboto";
     15        font-size: 3em;
     16        font-variation-settings: 'wdth' 50;
     17    }
     18    .stretch75 {
     19        font-family: "Roboto";
     20        font-size: 3em;
     21        font-variation-settings: 'wdth' 75;
     22    }
     23    .stretch87 {
     24        font-family: "Roboto";
     25        font-size: 3em;
     26        font-variation-settings: 'wdth' 87.5;
     27    }
     28    .stretch100 {
     29        font-family: "Roboto";
     30        font-size: 3em;
     31        font-variation-settings: 'wdth' 100;
     32    }
     33    .stretch112 {
     34        font-family: "Roboto";
     35        font-size: 3em;
     36        font-variation-settings: 'wdth' 112.5;
     37    }
     38    .stretch125 {
     39        font-family: "Roboto";
     40        font-size: 3em;
     41        font-variation-settings: 'wdth' 125;
     42    }
     43    .stretch200 {
     44        font-family: "Roboto";
     45        font-size: 3em;
     46        font-variation-settings: 'wdth' 200;
     47    }
     48 </style>
     49 
     50 <p class="stretch50">text</p>
     51 <p class="stretch75">text</p>
     52 <p class="stretch87">text</p>
     53 <p class="stretch100">text</p>
     54 <p class="stretch112">text</p>
     55 <p class="stretch125">text</p>
     56 <p class="stretch200">text</p>