font-display-1-ref.html (740B)
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <title>font-display test</title> 5 <meta charset="utf-8"> 6 <style> 7 body { margin: 20px } 8 9 @font-face { 10 font-family: test1-ref; 11 src: url(../fonts/markA.woff); 12 } 13 14 div.test { 15 font-size: 600%; 16 line-height: 1.3em; 17 width: 500px; 18 } 19 20 div.test p { 21 display: inline-block; 22 width: 150px; 23 margin: 0; 24 } 25 26 .auto { font-family: test1-ref; } 27 .block { font-family: test1-ref; } 28 .swap { font-family: test1-ref; } 29 .fallback { font-family: test1-ref; } 30 .optional { font-family: font-that-does-not-exist; } 31 32 </style> 33 </head> 34 35 <body> 36 <div class="test"> 37 <p class="auto">A</p> 38 <p class="block">A</p> 39 </div> 40 <div class="test"> 41 <p class="swap">A</p> 42 <p class="fallback">A</p> 43 <p class="optional">A</p> 44 </div> 45 </body> 46 </html>