layout/reftests/font-matching/stretchmapping-137-ref.html

Wed, 31 Dec 2014 13:27:57 +0100

author
Michael Schloh von Bennewitz <michael@schloh.com>
date
Wed, 31 Dec 2014 13:27:57 +0100
branch
TOR_BUG_3246
changeset 6
8bccb770b82d
permissions
-rw-r--r--

Ignore runtime configuration files generated during quality assurance.

michael@0 1 <!DOCTYPE HTML>
michael@0 2 <html>
michael@0 3 <head>
michael@0 4 <title>font-stretch mapping tests</title>
michael@0 5 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
michael@0 6
michael@0 7 <style type="text/css">
michael@0 8
michael@0 9 body {
michael@0 10 margin: 50px;
michael@0 11 font-family: Verdana, sans-serif;
michael@0 12 }
michael@0 13
michael@0 14 h3, h4 { font-weight: normal; }
michael@0 15
michael@0 16 table {
michael@0 17 border-collapse: collapse;
michael@0 18 font-size: 28px;
michael@0 19 }
michael@0 20
michael@0 21 td {
michael@0 22 padding: 0; margin: 0;
michael@0 23 font-family: test;
michael@0 24 }
michael@0 25
michael@0 26 th {
michael@0 27 font-weight: inherit;
michael@0 28 }
michael@0 29
michael@0 30 p { width: 300px; }
michael@0 31
michael@0 32 .red { color: red; }
michael@0 33
michael@0 34 thead { font-weight: 400; font-size: 75%; }
michael@0 35
michael@0 36 /* make all the spans blocks to avoid influence of what's outside them
michael@0 37 on line-height calculations */
michael@0 38 span { display: block; }
michael@0 39
michael@0 40 @font-face {
michael@0 41 font-family: test;
michael@0 42 src: url(../fonts/mplus/mplus-1p-thin.ttf);
michael@0 43 font-weight: 100;
michael@0 44 font-stretch: ultra-condensed;
michael@0 45 }
michael@0 46
michael@0 47 @font-face {
michael@0 48 font-family: test;
michael@0 49 src: url(../fonts/mplus/mplus-1p-regular.ttf);
michael@0 50 font-weight: 400;
michael@0 51 font-stretch: ultra-condensed;
michael@0 52 }
michael@0 53
michael@0 54 @font-face {
michael@0 55 font-family: test;
michael@0 56 src: url(../fonts/mplus/mplus-1p-light.ttf);
michael@0 57 font-weight: 200;
michael@0 58 font-stretch: condensed;
michael@0 59 }
michael@0 60
michael@0 61 @font-face {
michael@0 62 font-family: test;
michael@0 63 src: url(../fonts/mplus/mplus-1p-heavy.ttf);
michael@0 64 font-weight: 800;
michael@0 65 font-stretch: condensed;
michael@0 66 }
michael@0 67
michael@0 68 @font-face {
michael@0 69 font-family: test;
michael@0 70 src: url(../fonts/mplus/mplus-1p-medium.ttf);
michael@0 71 font-weight: 500;
michael@0 72 font-stretch: expanded;
michael@0 73 }
michael@0 74
michael@0 75 @font-face {
michael@0 76 font-family: test;
michael@0 77 src: url(../fonts/mplus/mplus-1p-black.ttf);
michael@0 78 font-weight: 900;
michael@0 79 font-stretch: expanded;
michael@0 80 }
michael@0 81
michael@0 82 @font-face {
michael@0 83 font-family: test100;
michael@0 84 src: url(../fonts/mplus/mplus-1p-thin.ttf);
michael@0 85 font-weight: 100;
michael@0 86 }
michael@0 87
michael@0 88 @font-face {
michael@0 89 font-family: test200;
michael@0 90 src: url(../fonts/mplus/mplus-1p-light.ttf);
michael@0 91 font-weight: 200;
michael@0 92 }
michael@0 93
michael@0 94 @font-face {
michael@0 95 font-family: test400;
michael@0 96 src: url(../fonts/mplus/mplus-1p-regular.ttf);
michael@0 97 font-weight: 400;
michael@0 98 }
michael@0 99
michael@0 100 @font-face {
michael@0 101 font-family: test500;
michael@0 102 src: url(../fonts/mplus/mplus-1p-medium.ttf);
michael@0 103 font-weight: 500;
michael@0 104 }
michael@0 105
michael@0 106 @font-face {
michael@0 107 font-family: test800;
michael@0 108 src: url(../fonts/mplus/mplus-1p-heavy.ttf);
michael@0 109 font-weight: 800;
michael@0 110 }
michael@0 111
michael@0 112 @font-face {
michael@0 113 font-family: test900;
michael@0 114 src: url(../fonts/mplus/mplus-1p-black.ttf);
michael@0 115 font-weight: 900;
michael@0 116 }
michael@0 117
michael@0 118 .w1 { font-weight: 100; }
michael@0 119 .w2 { font-weight: 200; }
michael@0 120 .w3 { font-weight: 300; }
michael@0 121 .w4 { font-weight: 400; }
michael@0 122 .w5 { font-weight: 500; }
michael@0 123 .w6 { font-weight: 600; }
michael@0 124 .w7 { font-weight: 700; }
michael@0 125 .w8 { font-weight: 800; }
michael@0 126 .w9 { font-weight: 900; }
michael@0 127
michael@0 128 .w1 .fs1 { font-family: test100; }
michael@0 129 .w2 .fs1 { font-family: test100; }
michael@0 130 .w3 .fs1 { font-family: test100; }
michael@0 131 .w4 .fs1 { font-family: test400; }
michael@0 132 .w5 .fs1 { font-family: test400; }
michael@0 133 .w6 .fs1 { font-family: test400; }
michael@0 134 .w7 .fs1 { font-family: test400; }
michael@0 135 .w8 .fs1 { font-family: test400; }
michael@0 136 .w9 .fs1 { font-family: test400; }
michael@0 137
michael@0 138 .w1 .fs2 { font-family: test100; }
michael@0 139 .w2 .fs2 { font-family: test100; }
michael@0 140 .w3 .fs2 { font-family: test100; }
michael@0 141 .w4 .fs2 { font-family: test400; }
michael@0 142 .w5 .fs2 { font-family: test400; }
michael@0 143 .w6 .fs2 { font-family: test400; }
michael@0 144 .w7 .fs2 { font-family: test400; }
michael@0 145 .w8 .fs2 { font-family: test400; }
michael@0 146 .w9 .fs2 { font-family: test400; }
michael@0 147
michael@0 148 .w1 .fs3 { font-family: test200; }
michael@0 149 .w2 .fs3 { font-family: test200; }
michael@0 150 .w3 .fs3 { font-family: test200; }
michael@0 151 .w4 .fs3 { font-family: test200; }
michael@0 152 .w5 .fs3 { font-family: test200; }
michael@0 153 .w6 .fs3 { font-family: test800; }
michael@0 154 .w7 .fs3 { font-family: test800; }
michael@0 155 .w8 .fs3 { font-family: test800; }
michael@0 156 .w9 .fs3 { font-family: test800; }
michael@0 157
michael@0 158 .w1 .fs4 { font-family: test200; }
michael@0 159 .w2 .fs4 { font-family: test200; }
michael@0 160 .w3 .fs4 { font-family: test200; }
michael@0 161 .w4 .fs4 { font-family: test200; }
michael@0 162 .w5 .fs4 { font-family: test200; }
michael@0 163 .w6 .fs4 { font-family: test800; }
michael@0 164 .w7 .fs4 { font-family: test800; }
michael@0 165 .w8 .fs4 { font-family: test800; }
michael@0 166 .w9 .fs4 { font-family: test800; }
michael@0 167
michael@0 168 .w1 .fs5 { font-family: test200; }
michael@0 169 .w2 .fs5 { font-family: test200; }
michael@0 170 .w3 .fs5 { font-family: test200; }
michael@0 171 .w4 .fs5 { font-family: test200; }
michael@0 172 .w5 .fs5 { font-family: test200; }
michael@0 173 .w6 .fs5 { font-family: test800; }
michael@0 174 .w7 .fs5 { font-family: test800; }
michael@0 175 .w8 .fs5 { font-family: test800; }
michael@0 176 .w9 .fs5 { font-family: test800; }
michael@0 177
michael@0 178 .w1 .fs6 { font-family: test500; }
michael@0 179 .w2 .fs6 { font-family: test500; }
michael@0 180 .w3 .fs6 { font-family: test500; }
michael@0 181 .w4 .fs6 { font-family: test500; }
michael@0 182 .w5 .fs6 { font-family: test500; }
michael@0 183 .w6 .fs6 { font-family: test900; }
michael@0 184 .w7 .fs6 { font-family: test900; }
michael@0 185 .w8 .fs6 { font-family: test900; }
michael@0 186 .w9 .fs6 { font-family: test900; }
michael@0 187
michael@0 188 .w1 .fs7 { font-family: test500; }
michael@0 189 .w2 .fs7 { font-family: test500; }
michael@0 190 .w3 .fs7 { font-family: test500; }
michael@0 191 .w4 .fs7 { font-family: test500; }
michael@0 192 .w5 .fs7 { font-family: test500; }
michael@0 193 .w6 .fs7 { font-family: test900; }
michael@0 194 .w7 .fs7 { font-family: test900; }
michael@0 195 .w8 .fs7 { font-family: test900; }
michael@0 196 .w9 .fs7 { font-family: test900; }
michael@0 197
michael@0 198 .w1 .fs8 { font-family: test500; }
michael@0 199 .w2 .fs8 { font-family: test500; }
michael@0 200 .w3 .fs8 { font-family: test500; }
michael@0 201 .w4 .fs8 { font-family: test500; }
michael@0 202 .w5 .fs8 { font-family: test500; }
michael@0 203 .w6 .fs8 { font-family: test900; }
michael@0 204 .w7 .fs8 { font-family: test900; }
michael@0 205 .w8 .fs8 { font-family: test900; }
michael@0 206 .w9 .fs8 { font-family: test900; }
michael@0 207
michael@0 208 .w1 .fs9 { font-family: test500; }
michael@0 209 .w2 .fs9 { font-family: test500; }
michael@0 210 .w3 .fs9 { font-family: test500; }
michael@0 211 .w4 .fs9 { font-family: test500; }
michael@0 212 .w5 .fs9 { font-family: test500; }
michael@0 213 .w6 .fs9 { font-family: test900; }
michael@0 214 .w7 .fs9 { font-family: test900; }
michael@0 215 .w8 .fs9 { font-family: test900; }
michael@0 216 .w9 .fs9 { font-family: test900; }
michael@0 217
michael@0 218 </style>
michael@0 219 </head>
michael@0 220 <body>
michael@0 221
michael@0 222 <p>Font family with ultra-condensed 100, 400, condensed 200, 800 and expanded 500, 900</p>
michael@0 223
michael@0 224 <table>
michael@0 225 <thead>
michael@0 226 <th></th>
michael@0 227 <th class="red">1</th>
michael@0 228 <th>2</th>
michael@0 229 <th class="red">3</th>
michael@0 230 <th>4</th>
michael@0 231 <th>5</th>
michael@0 232 <th>6</th>
michael@0 233 <th class="red">7</th>
michael@0 234 <th>8</th>
michael@0 235 <th>9</th>
michael@0 236 </thead>
michael@0 237 <tr class="w1">
michael@0 238 <th>100</th>
michael@0 239 <td class="fs1"><span>か</span></td>
michael@0 240 <td class="fs2"><span>か</span></td>
michael@0 241 <td class="fs3"><span>か</span></td>
michael@0 242 <td class="fs4"><span>か</span></td>
michael@0 243 <td class="fs5"><span>か</span></td>
michael@0 244 <td class="fs6"><span>か</span></td>
michael@0 245 <td class="fs7"><span>か</span></td>
michael@0 246 <td class="fs8"><span>か</span></td>
michael@0 247 <td class="fs9"><span>か</span></td>
michael@0 248 </tr>
michael@0 249 <tr class="w2">
michael@0 250 <th>200</th>
michael@0 251 <td class="fs1"><span>か</span></td>
michael@0 252 <td class="fs2"><span>か</span></td>
michael@0 253 <td class="fs3"><span>か</span></td>
michael@0 254 <td class="fs4"><span>か</span></td>
michael@0 255 <td class="fs5"><span>か</span></td>
michael@0 256 <td class="fs6"><span>か</span></td>
michael@0 257 <td class="fs7"><span>か</span></td>
michael@0 258 <td class="fs8"><span>か</span></td>
michael@0 259 <td class="fs9"><span>か</span></td>
michael@0 260 </tr>
michael@0 261 <tr class="w3">
michael@0 262 <th>300</th>
michael@0 263 <td class="fs1"><span>か</span></td>
michael@0 264 <td class="fs2"><span>か</span></td>
michael@0 265 <td class="fs3"><span>か</span></td>
michael@0 266 <td class="fs4"><span>か</span></td>
michael@0 267 <td class="fs5"><span>か</span></td>
michael@0 268 <td class="fs6"><span>か</span></td>
michael@0 269 <td class="fs7"><span>か</span></td>
michael@0 270 <td class="fs8"><span>か</span></td>
michael@0 271 <td class="fs9"><span>か</span></td>
michael@0 272 </tr>
michael@0 273 <tr class="w4">
michael@0 274 <th>400</th>
michael@0 275 <td class="fs1"><span>か</span></td>
michael@0 276 <td class="fs2"><span>か</span></td>
michael@0 277 <td class="fs3"><span>か</span></td>
michael@0 278 <td class="fs4"><span>か</span></td>
michael@0 279 <td class="fs5"><span>か</span></td>
michael@0 280 <td class="fs6"><span>か</span></td>
michael@0 281 <td class="fs7"><span>か</span></td>
michael@0 282 <td class="fs8"><span>か</span></td>
michael@0 283 <td class="fs9"><span>か</span></td>
michael@0 284 </tr>
michael@0 285 <tr class="w5">
michael@0 286 <th>500</th>
michael@0 287 <td class="fs1"><span>か</span></td>
michael@0 288 <td class="fs2"><span>か</span></td>
michael@0 289 <td class="fs3"><span>か</span></td>
michael@0 290 <td class="fs4"><span>か</span></td>
michael@0 291 <td class="fs5"><span>か</span></td>
michael@0 292 <td class="fs6"><span>か</span></td>
michael@0 293 <td class="fs7"><span>か</span></td>
michael@0 294 <td class="fs8"><span>か</span></td>
michael@0 295 <td class="fs9"><span>か</span></td>
michael@0 296 </tr>
michael@0 297 <tr class="w6">
michael@0 298 <th>600</th>
michael@0 299 <td class="fs1"><span>か</span></td>
michael@0 300 <td class="fs2"><span>か</span></td>
michael@0 301 <td class="fs3"><span>か</span></td>
michael@0 302 <td class="fs4"><span>か</span></td>
michael@0 303 <td class="fs5"><span>か</span></td>
michael@0 304 <td class="fs6"><span>か</span></td>
michael@0 305 <td class="fs7"><span>か</span></td>
michael@0 306 <td class="fs8"><span>か</span></td>
michael@0 307 <td class="fs9"><span>か</span></td>
michael@0 308 </tr>
michael@0 309 <tr class="w7">
michael@0 310 <th>700</th>
michael@0 311 <td class="fs1"><span>か</span></td>
michael@0 312 <td class="fs2"><span>か</span></td>
michael@0 313 <td class="fs3"><span>か</span></td>
michael@0 314 <td class="fs4"><span>か</span></td>
michael@0 315 <td class="fs5"><span>か</span></td>
michael@0 316 <td class="fs6"><span>か</span></td>
michael@0 317 <td class="fs7"><span>か</span></td>
michael@0 318 <td class="fs8"><span>か</span></td>
michael@0 319 <td class="fs9"><span>か</span></td>
michael@0 320 </tr>
michael@0 321 <tr class="w8">
michael@0 322 <th>800</th>
michael@0 323 <td class="fs1"><span>か</span></td>
michael@0 324 <td class="fs2"><span>か</span></td>
michael@0 325 <td class="fs3"><span>か</span></td>
michael@0 326 <td class="fs4"><span>か</span></td>
michael@0 327 <td class="fs5"><span>か</span></td>
michael@0 328 <td class="fs6"><span>か</span></td>
michael@0 329 <td class="fs7"><span>か</span></td>
michael@0 330 <td class="fs8"><span>か</span></td>
michael@0 331 <td class="fs9"><span>か</span></td>
michael@0 332 </tr>
michael@0 333 <tr class="w9">
michael@0 334 <th>900</th>
michael@0 335 <td class="fs1"><span>か</span></td>
michael@0 336 <td class="fs2"><span>か</span></td>
michael@0 337 <td class="fs3"><span>か</span></td>
michael@0 338 <td class="fs4"><span>か</span></td>
michael@0 339 <td class="fs5"><span>か</span></td>
michael@0 340 <td class="fs6"><span>か</span></td>
michael@0 341 <td class="fs7"><span>か</span></td>
michael@0 342 <td class="fs8"><span>か</span></td>
michael@0 343 <td class="fs9"><span>か</span></td>
michael@0 344 </tr>
michael@0 345 </table>
michael@0 346
michael@0 347 </body>
michael@0 348 </html>

mercurial