1.1 --- /dev/null Thu Jan 01 00:00:00 1970 +0000
1.2 +++ b/layout/reftests/font-face/synthetic-variations.html Wed Dec 31 06:09:35 2014 +0100
1.3 @@ -0,0 +1,140 @@
1.4 +<!DOCTYPE HTML>
1.5 +<html><head>
1.6 +
1.7 +
1.8 +<title>@font-face and synthetic rendering</title>
1.9 +<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
1.10 +
1.11 +<style type="text/css">
1.12 +
1.13 +@font-face {
1.14 + font-family: test1;
1.15 + src: url(../fonts/mplus/mplus-1p-regular.ttf);
1.16 + font-weight: normal;
1.17 +}
1.18 +
1.19 +@font-face {
1.20 + font-family: test2;
1.21 + src: url(../fonts/mplus/mplus-1p-regular.ttf);
1.22 + font-weight: normal;
1.23 +}
1.24 +
1.25 +@font-face {
1.26 + font-family: test3;
1.27 + src: url(../fonts/mplus/mplus-1p-thin.ttf);
1.28 + font-weight: 100;
1.29 +}
1.30 +
1.31 +@font-face {
1.32 + font-family: test3;
1.33 + src: url(../fonts/mplus/mplus-1p-regular.ttf);
1.34 + font-weight: 300;
1.35 +}
1.36 +
1.37 +body {
1.38 + margin: 50px;
1.39 + font-family: sans-serif;
1.40 + font-size: 18pt;
1.41 +}
1.42 +
1.43 +table {
1.44 + border-collapse: collapse;
1.45 +}
1.46 +
1.47 +.w1 { font-weight: 100; }
1.48 +.w2 { font-weight: 200; }
1.49 +.w3 { font-weight: 300; }
1.50 +.w4 { font-weight: 400; }
1.51 +.w5 { font-weight: 500; }
1.52 +.w6 { font-weight: 600; }
1.53 +.w7 { font-weight: 700; }
1.54 +.w8 { font-weight: 800; }
1.55 +.w9 { font-weight: 900; }
1.56 +
1.57 +#test1 { font-family: test1, Times New Roman, Times, Bitstream Vera, serif; }
1.58 +#test2 { font-family: test2, Times New Roman, Times, Bitstream Vera, serif; }
1.59 +#test3 { font-family: test3, Times New Roman, Times, Bitstream Vera, serif; }
1.60 +
1.61 +th, td {
1.62 + font-weight: inherit;
1.63 + padding-left: 1em;
1.64 + padding-right: 1em;
1.65 + text-align: left;
1.66 +}
1.67 +
1.68 +em { font-style: italic; }
1.69 +
1.70 +#test1 .w1 td, #test1 .w1 td span { font-weight: bolder; }
1.71 +#test1 .w2 td, #test1 .w2 td span { font-weight: bolder; }
1.72 +#test1 .w3 td, #test1 .w3 td span { font-weight: bolder; }
1.73 +#test1 .w4 td { font-weight: bolder; }
1.74 +#test1 .w5 td { font-weight: bolder; }
1.75 +#test1 .w6 th { font-weight: lighter; }
1.76 +#test1 .w7 th { font-weight: lighter; }
1.77 +#test1 .w8 th, #test1 .w8 th span { font-weight: lighter; }
1.78 +#test1 .w9 th, #test1 .w9 th span { font-weight: lighter; }
1.79 +
1.80 +#test2 .w1 td, #test2 .w1 td span { font-weight: bolder; }
1.81 +#test2 .w2 td, #test2 .w2 td span { font-weight: bolder; }
1.82 +#test2 .w3 td, #test2 .w3 td span { font-weight: bolder; }
1.83 +#test2 .w4 td { font-weight: bolder; }
1.84 +#test2 .w5 td { font-weight: bolder; }
1.85 +#test2 .w6 th { font-weight: lighter; }
1.86 +#test2 .w7 th { font-weight: lighter; }
1.87 +#test2 .w8 th, #test2 .w8 th span { font-weight: lighter; }
1.88 +#test2 .w9 th, #test2 .w9 th span { font-weight: lighter; }
1.89 +
1.90 +#test3 .w1 th, #test3 .w1 td, #test3 .w1 td span { font-weight: bolder; }
1.91 +#test3 .w2 th, #test3 .w2 td, #test3 .w2 td span { font-weight: bolder; }
1.92 +#test3 .w3 th, #test3 .w3 td, #test3 .w3 td span { font-weight: bolder; }
1.93 +#test3 .w4 td { font-weight: bolder; }
1.94 +#test3 .w5 td { font-weight: bolder; }
1.95 +#test3 .w6 th { font-weight: lighter; }
1.96 +#test3 .w7 th { font-weight: lighter; }
1.97 +#test3 .w8 td, #test3 .w8 th, #test3 .w8 th span { font-weight: lighter; }
1.98 +#test3 .w9 td, #test3 .w9 th, #test3 .w9 th span { font-weight: lighter; }
1.99 +
1.100 +</style>
1.101 +
1.102 +
1.103 +</head><body>
1.104 +
1.105 +<p>All lines should appear in a sans-serif face with proper bolding</p>
1.106 +
1.107 +<table id="test1">
1.108 +<tr class="w1"><th><span>normal</span></th><th><em><span>italic</span></em></th><td><span>bold</span></td><td><em><span>bolditalic</span></em></td></tr>
1.109 +<tr class="w2"><th><span>normal</span></th><th><em><span>italic</span></em></th><td><span>bold</span></td><td><em><span>bolditalic</span></em></td></tr>
1.110 +<tr class="w3"><th><span>normal</span></th><th><em><span>italic</span></em></th><td><span>bold</span></td><td><em><span>bolditalic</span></em></td></tr>
1.111 +<tr class="w4"><th><span>normal</span></th><th><em><span>italic</span></em></th><td><span>bold</span></td><td><em><span>bolditalic</span></em></td></tr>
1.112 +<tr class="w5"><th><span>normal</span></th><th><em><span>italic</span></em></th><td><span>bold</span></td><td><em><span>bolditalic</span></em></td></tr>
1.113 +<tr class="w6"><th><span>normal</span></th><th><em><span>italic</span></em></th><td><span>bold</span></td><td><em><span>bolditalic</span></em></td></tr>
1.114 +<tr class="w7"><th><span>normal</span></th><th><em><span>italic</span></em></th><td><span>bold</span></td><td><em><span>bolditalic</span></em></td></tr>
1.115 +<tr class="w8"><th><span>normal</span></th><th><em><span>italic</span></em></th><td><span>bold</span></td><td><em><span>bolditalic</span></em></td></tr>
1.116 +<tr class="w9"><th><span>normal</span></th><th><em><span>italic</span></em></th><td><span>bold</span></td><td><em><span>bolditalic</span></em></td></tr>
1.117 +</table>
1.118 +
1.119 +<table id="test2">
1.120 +<tr class="w9"><th><span>normal</span></th><th><em><span>italic</span></em></th><td><span>bold</span></td><td><em><span>bolditalic</span></em></td></tr>
1.121 +<tr class="w8"><th><span>normal</span></th><th><em><span>italic</span></em></th><td><span>bold</span></td><td><em><span>bolditalic</span></em></td></tr>
1.122 +<tr class="w7"><th><span>normal</span></th><th><em><span>italic</span></em></th><td><span>bold</span></td><td><em><span>bolditalic</span></em></td></tr>
1.123 +<tr class="w6"><th><span>normal</span></th><th><em><span>italic</span></em></th><td><span>bold</span></td><td><em><span>bolditalic</span></em></td></tr>
1.124 +<tr class="w5"><th><span>normal</span></th><th><em><span>italic</span></em></th><td><span>bold</span></td><td><em><span>bolditalic</span></em></td></tr>
1.125 +<tr class="w4"><th><span>normal</span></th><th><em><span>italic</span></em></th><td><span>bold</span></td><td><em><span>bolditalic</span></em></td></tr>
1.126 +<tr class="w3"><th><span>normal</span></th><th><em><span>italic</span></em></th><td><span>bold</span></td><td><em><span>bolditalic</span></em></td></tr>
1.127 +<tr class="w2"><th><span>normal</span></th><th><em><span>italic</span></em></th><td><span>bold</span></td><td><em><span>bolditalic</span></em></td></tr>
1.128 +<tr class="w1"><th><span>normal</span></th><th><em><span>italic</span></em></th><td><span>bold</span></td><td><em><span>bolditalic</span></em></td></tr>
1.129 +</table>
1.130 +
1.131 +<table id="test3">
1.132 +<tr class="w1"><th><span>normal</span></th><th><span><em>italic</em></span></th><td><span>bold</span></td><td><span><em>bolditalic</em></span></td></tr>
1.133 +<tr class="w2"><th><span>normal</span></th><th><span><em>italic</em></span></th><td><span>bold</span></td><td><span><em>bolditalic</em></span></td></tr>
1.134 +<tr class="w3"><th><span>normal</span></th><th><span><em>italic</em></span></th><td><span>bold</span></td><td><span><em>bolditalic</em></span></td></tr>
1.135 +<tr class="w4"><th><span>normal</span></th><th><span><em>italic</em></span></th><td><span>bold</span></td><td><span><em>bolditalic</em></span></td></tr>
1.136 +<tr class="w5"><th><span>normal</span></th><th><span><em>italic</em></span></th><td><span>bold</span></td><td><span><em>bolditalic</em></span></td></tr>
1.137 +<tr class="w6"><th><span>normal</span></th><th><span><em>italic</em></span></th><td><span>bold</span></td><td><span><em>bolditalic</em></span></td></tr>
1.138 +<tr class="w7"><th><span>normal</span></th><th><span><em>italic</em></span></th><td><span>bold</span></td><td><span><em>bolditalic</em></span></td></tr>
1.139 +<tr class="w8"><th><span>normal</span></th><th><span><em>italic</em></span></th><td><span>bold</span></td><td><span><em>bolditalic</em></span></td></tr>
1.140 +<tr class="w9"><th><span>normal</span></th><th><span><em>italic</em></span></th><td><span>bold</span></td><td><span><em>bolditalic</em></span></td></tr>
1.141 +</table>
1.142 +
1.143 +</body></html>
