|
1 <!DOCTYPE HTML> |
|
2 <html> |
|
3 <head> |
|
4 <title>src local on load fallback</title> |
|
5 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> |
|
6 |
|
7 <style type="text/css"> |
|
8 |
|
9 body { |
|
10 margin: 50px; |
|
11 font-size: 24pt; |
|
12 font-family: sans-serif; |
|
13 } |
|
14 |
|
15 p { margin-left: 1em; } |
|
16 |
|
17 @font-face { |
|
18 font-family: test0; |
|
19 src: local("Futura-Medium"), local("Bitstream Vera Sans"), local("Bitstream Vera Sans Roman"), local("DejaVu Sans"), local("Arial"); |
|
20 } |
|
21 |
|
22 @font-face { |
|
23 font-family: test1; |
|
24 src: url(bogus-dir/bogus.ttf), local("Futura-Medium"), local("Bitstream Vera Sans"), local("Bitstream Vera Sans Roman"), local("DejaVu Sans"), local("Arial"); |
|
25 } |
|
26 |
|
27 @font-face { |
|
28 font-family: test2; |
|
29 src: url(../fonts/README), local("Futura-Medium"), local("Bitstream Vera Sans"), local("Bitstream Vera Sans Roman"), local("DejaVu Sans"), local("Arial"); |
|
30 } |
|
31 |
|
32 @font-face { |
|
33 font-family: test3; |
|
34 src: url(../fonts/README), local("Bogosity"), local("Futura-Medium"), local("Bitstream Vera Sans"), local("Bitstream Vera Sans Roman"), local("DejaVu Sans"), local("Arial"); |
|
35 } |
|
36 |
|
37 @font-face { |
|
38 font-family: test4; |
|
39 src: url(../fonts/README), local("Bogosity"), url(bogus-dir/bogus.ttf), local("Futura-Medium"), local("Bitstream Vera Sans"), local("Bitstream Vera Sans Roman"), local("DejaVu Sans"), local("Arial"); |
|
40 } |
|
41 |
|
42 #test0 { font-family: test0, serif; } |
|
43 #test1 { font-family: test1, serif; } |
|
44 #test2 { font-family: test2, serif; } |
|
45 #test3 { font-family: test3, serif; } |
|
46 #test4 { font-family: test4, serif; } |
|
47 |
|
48 </style> |
|
49 |
|
50 <script type="text/javascript"> |
|
51 |
|
52 </script> |
|
53 |
|
54 </head> |
|
55 <body> |
|
56 |
|
57 <h4>These should appear in sans-serif face, not serif:</h4> |
|
58 |
|
59 <p id="test0">Simple use of src local()</p> |
|
60 |
|
61 <p id="test1">The URL for the font data is bogus</p> |
|
62 |
|
63 <p id="test2">The URL exists but does not return font data</p> |
|
64 |
|
65 <p id="test3">Same as above, but first local not found</p> |
|
66 |
|
67 <p id="test4">Same as above, bogus url follows unknown local font</p> |
|
68 |
|
69 </body> |
|
70 </html> |