fixed-stretch-style-over-weight.html (1329B)
1 <!DOCTYPE html> 2 <html class="reftest-wait"> 3 <meta charset="utf-8"> 4 <link rel="stylesheet" href="font-matching.css"> 5 <!-- Tests CSS Fonts Level 4, section 5.2. font matching algorithm. Precedence 6 of properties (stretch over style, style over weight) and style over weight 7 priority. --> 8 <style> 9 @font-face { 10 font-family: variable_axes; 11 src: url("resources/variabletest_matching.ttf"); 12 font-stretch: 100%; 13 font-style: oblique -67.5deg -45deg; 14 font-weight: 700 800; 15 } 16 17 @font-face { 18 font-family: variable_axes; 19 src: url("resources/variabletest_matching.ttf"); 20 font-stretch: 100%; 21 font-style: oblique 45deg 67.5deg; 22 font-weight: 200 300; 23 } 24 </style> 25 <link rel="match" href="fixed-stretch-style-over-weight-ref.html"> 26 <span id="stretch_style_weight_1">MNOP</span> 27 <span id="stretch_style_weight_2">MNOP</span> 28 <span id="stretch_style_weight_3">MNOP</span> 29 <span id="stretch_style_weight_4">MNOP</span> 30 <span id="stretch_style_weight_5">MNOP</span> 31 <span id="stretch_style_weight_6">MNOP</span> 32 <span id="stretch_style_weight_7">MNOP</span> 33 <span id="stretch_style_weight_8">MNOP</span> 34 <span id="stretch_style_weight_9">MNOP</span> 35 <script> 36 document.fonts.ready.then( 37 () => { document.documentElement.classList.remove("reftest-wait"); }); 38 </script> 39 </html>