quoted-generic-ignored.html (1360B)
1 <!DOCTYPE HTML> 2 <html lang="en"> 3 <head> 4 <meta charset=utf-8> 5 <title>CSS Test: quoted font-family names must not be treated as generics</title> 6 <link rel="author" title="Jonathan Kew" href="mailto:jfkthame@gmail.com"/> 7 <link rel="help" href="https://www.w3.org/TR/css-fonts-3/#font-family-prop"/> 8 <link rel="match" href="quoted-generic-ignored-ref.html"/> 9 <meta name="assert" content="Font family names that happen to be the same as keyword value must be quoted to prevent confusion with the keywords with the same names"/> 10 <style> 11 body { font-size: 36px; } 12 /* Note that this test assumes that the system does not have an actual 13 font named "Fantasy" or "Cursive" installed! */ 14 .fantasy-test1 { font-family: "fantasy", serif; } 15 .fantasy-test2 { font-family: "fantasy", sans-serif; } 16 .fantasy-test3 { font-family: "fantasy", monospace; } 17 .cursive-test1 { font-family: "cursive", serif; } 18 .cursive-test2 { font-family: "cursive", sans-serif; } 19 .cursive-test3 { font-family: "cursive", monospace; } 20 </style> 21 </head> 22 <body> 23 <p>The following lines should be rendered with the generic font-families as named:</p> 24 <div class="fantasy-test1">serif</div> 25 <div class="fantasy-test2">sans-serif</div> 26 <div class="fantasy-test3">monospace</div> 27 <div class="cursive-test1">serif</div> 28 <div class="cursive-test2">sans-serif</div> 29 <div class="cursive-test3">monospace</div>