font-face-weight-auto-variable-ref.html (1127B)
1 <!DOCTYPE html> 2 <html lang="en"> 3 <meta charset="utf-8"/> 4 <title>CSS Test: Support for font-weight: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-weight: 100 900; 12 } 13 .weight50 { 14 font-family: "Roboto"; 15 font-size: 3em; 16 font-variation-settings: 'wght' 50; 17 } 18 .weight100 { 19 font-family: "Roboto"; 20 font-size: 3em; 21 font-variation-settings: 'wght' 100; 22 } 23 .weight400 { 24 font-family: "Roboto"; 25 font-size: 3em; 26 font-variation-settings: 'wght' 400; 27 } 28 .weight900 { 29 font-family: "Roboto"; 30 font-size: 3em; 31 font-variation-settings: 'wght' 900; 32 } 33 .weight990 { 34 font-family: "Roboto"; 35 font-size: 3em; 36 font-variation-settings: 'wght' 990; 37 } 38 </style> 39 40 <p class="weight50">text</p> 41 <p class="weight100">text</p> 42 <p class="weight400">text</p> 43 <p class="weight900">text</p> 44 <p class="weight990">text</p>