layout/reftests/font-matching/stretchmapping-all.html@4ab42b5ab56c
layout/reftests/font-matching/stretchmapping-all.html
Wed, 31 Dec 2014 07:53:36 +0100
- author
- Michael Schloh von Bennewitz <michael@schloh.com>
- date
- Wed, 31 Dec 2014 07:53:36 +0100
- branch
- TOR_BUG_3246
- changeset 5
- 4ab42b5ab56c
- permissions
- -rw-r--r--
Correct small whitespace inconsistency, lost while renaming variables.
1 <!DOCTYPE HTML>
2 <html>
3 <head>
4 <title>font-stretch matching tests</title>
5 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
7 <style type="text/css">
9 body {
10 margin: 50px;
11 font-family: Calibri, Verdana, sans-serif;
12 }
14 p { margin: 0; padding: 0; }
16 table {
17 border-collapse: collapse;
18 }
20 th {
21 font-weight: normal;
22 background-color: #eee;
23 }
25 th, td { width: 3em; text-align: left; }
26 tr th { text-align: left; }
28 .fstest-full { font-family: fstest-full; }
30 @font-face {
31 font-family: fstest-full;
32 src: url(../fonts/csstest-widths-wd1.ttf);
33 font-stretch: ultra-condensed;
34 }
36 @font-face {
37 font-family: fstest-full;
38 src: url(../fonts/csstest-widths-wd2.ttf);
39 font-stretch: extra-condensed;
40 }
42 @font-face {
43 font-family: fstest-full;
44 src: url(../fonts/csstest-widths-wd3.ttf);
45 font-stretch: condensed;
46 }
48 @font-face {
49 font-family: fstest-full;
50 src: url(../fonts/csstest-widths-wd4.ttf);
51 font-stretch: semi-condensed;
52 }
54 @font-face {
55 font-family: fstest-full;
56 src: url(../fonts/csstest-widths-wd5.ttf);
57 font-stretch: normal;
58 }
60 @font-face {
61 font-family: fstest-full;
62 src: url(../fonts/csstest-widths-wd6.ttf);
63 font-stretch: semi-expanded;
64 }
66 @font-face {
67 font-family: fstest-full;
68 src: url(../fonts/csstest-widths-wd7.ttf);
69 font-stretch: expanded;
70 }
72 @font-face {
73 font-family: fstest-full;
74 src: url(../fonts/csstest-widths-wd8.ttf);
75 font-stretch: extra-expanded;
76 }
78 @font-face {
79 font-family: fstest-full;
80 src: url(../fonts/csstest-widths-wd9.ttf);
81 font-stretch: ultra-expanded;
82 }
84 .fstest-1-3 { font-family: fstest-1-3; }
86 @font-face {
87 font-family: fstest-1-3;
88 src: url(../fonts/csstest-widths-wd1.ttf);
89 font-stretch: ultra-condensed;
90 }
92 @font-face {
93 font-family: fstest-1-3;
94 src: url(../fonts/csstest-widths-wd3.ttf);
95 font-stretch: condensed;
96 }
98 .fstest-1-4 { font-family: fstest-1-4; }
100 @font-face {
101 font-family: fstest-1-4;
102 src: url(../fonts/csstest-widths-wd1.ttf);
103 font-stretch: ultra-condensed;
104 }
106 @font-face {
107 font-family: fstest-1-4;
108 src: url(../fonts/csstest-widths-wd4.ttf);
109 font-stretch: semi-condensed;
110 }
112 .fstest-1-5 { font-family: fstest-1-5; }
114 @font-face {
115 font-family: fstest-1-5;
116 src: url(../fonts/csstest-widths-wd1.ttf);
117 font-stretch: ultra-condensed;
118 }
120 @font-face {
121 font-family: fstest-1-5;
122 src: url(../fonts/csstest-widths-wd5.ttf);
123 font-stretch: normal;
124 }
126 .fstest-2-6 { font-family: fstest-2-6; }
128 @font-face {
129 font-family: fstest-2-6;
130 src: url(../fonts/csstest-widths-wd2.ttf);
131 font-stretch: extra-condensed;
132 }
134 @font-face {
135 font-family: fstest-2-6;
136 src: url(../fonts/csstest-widths-wd6.ttf);
137 font-stretch: semi-expanded;
138 }
140 .fstest-4-6 { font-family: fstest-4-6; }
142 @font-face {
143 font-family: fstest-4-6;
144 src: url(../fonts/csstest-widths-wd4.ttf);
145 font-stretch: semi-condensed;
146 }
148 @font-face {
149 font-family: fstest-4-6;
150 src: url(../fonts/csstest-widths-wd6.ttf);
151 font-stretch: semi-expanded;
152 }
154 .fstest-4-7 { font-family: fstest-4-7; }
156 @font-face {
157 font-family: fstest-4-7;
158 src: url(../fonts/csstest-widths-wd4.ttf);
159 font-stretch: semi-condensed;
160 }
162 @font-face {
163 font-family: fstest-4-7;
164 src: url(../fonts/csstest-widths-wd7.ttf);
165 font-stretch: expanded;
166 }
168 .fstest-6-7 { font-family: fstest-6-7; }
170 @font-face {
171 font-family: fstest-6-7;
172 src: url(../fonts/csstest-widths-wd6.ttf);
173 font-stretch: semi-expanded;
174 }
176 @font-face {
177 font-family: fstest-6-7;
178 src: url(../fonts/csstest-widths-wd7.ttf);
179 font-stretch: expanded;
180 }
182 .fstest-7-9 { font-family: fstest-7-9; }
184 @font-face {
185 font-family: fstest-7-9;
186 src: url(../fonts/csstest-widths-wd7.ttf);
187 font-stretch: expanded;
188 }
190 @font-face {
191 font-family: fstest-7-9;
192 src: url(../fonts/csstest-widths-wd9.ttf);
193 font-stretch: ultra-expanded;
194 }
196 .fstest-8-9 { font-family: fstest-8-9; }
198 @font-face {
199 font-family: fstest-8-9;
200 src: url(../fonts/csstest-widths-wd8.ttf);
201 font-stretch: extra-expanded;
202 }
204 @font-face {
205 font-family: fstest-8-9;
206 src: url(../fonts/csstest-widths-wd9.ttf);
207 font-stretch: ultra-expanded;
208 }
210 .fs1 { font-stretch: ultra-condensed; }
211 .fs2 { font-stretch: extra-condensed; }
212 .fs3 { font-stretch: condensed; }
213 .fs4 { font-stretch: semi-condensed; }
214 .fs5 { font-stretch: normal; }
215 .fs6 { font-stretch: semi-expanded; }
216 .fs7 { font-stretch: expanded; }
217 .fs8 { font-stretch: extra-expanded; }
218 .fs9 { font-stretch: ultra-expanded; }
220 </style>
222 <script type="text/javascript">
224 </script>
226 </head>
227 <body>
229 <p>font-stretch mapping with different font family sets</p>
230 <p>(only numbers should appear in the body of the table)</p>
232 <table>
233 <thead>
234 <th>width</th>
235 <th>full</th>
236 <th>1-3</th>
237 <th>1-4</th>
238 <th>1-5</th>
239 <th>2-6</th>
240 <th>4-6</th>
241 <th>4-7</th>
242 <th>6-7</th>
243 <th>7-9</th>
244 <th>8-9</th>
245 </thead>
246 <tr class="fs1">
247 <th>1</th>
248 <td class="fstest-full">F</td>
249 <td class="fstest-1-3">F</td>
250 <td class="fstest-1-4">F</td>
251 <td class="fstest-1-5">F</td>
252 <td class="fstest-2-6">F</td>
253 <td class="fstest-4-6">F</td>
254 <td class="fstest-4-7">F</td>
255 <td class="fstest-6-7">F</td>
256 <td class="fstest-7-9">F</td>
257 <td class="fstest-8-9">F</td>
258 </tr>
259 <tr class="fs2">
260 <th>2</th>
261 <td class="fstest-full">F</td>
262 <td class="fstest-1-3">F</td>
263 <td class="fstest-1-4">F</td>
264 <td class="fstest-1-5">F</td>
265 <td class="fstest-2-6">F</td>
266 <td class="fstest-4-6">F</td>
267 <td class="fstest-4-7">F</td>
268 <td class="fstest-6-7">F</td>
269 <td class="fstest-7-9">F</td>
270 <td class="fstest-8-9">F</td>
271 </tr>
272 <tr class="fs3">
273 <th>3</th>
274 <td class="fstest-full">F</td>
275 <td class="fstest-1-3">F</td>
276 <td class="fstest-1-4">F</td>
277 <td class="fstest-1-5">F</td>
278 <td class="fstest-2-6">F</td>
279 <td class="fstest-4-6">F</td>
280 <td class="fstest-4-7">F</td>
281 <td class="fstest-6-7">F</td>
282 <td class="fstest-7-9">F</td>
283 <td class="fstest-8-9">F</td>
284 </tr>
285 <tr class="fs4">
286 <th>4</th>
287 <td class="fstest-full">F</td>
288 <td class="fstest-1-3">F</td>
289 <td class="fstest-1-4">F</td>
290 <td class="fstest-1-5">F</td>
291 <td class="fstest-2-6">F</td>
292 <td class="fstest-4-6">F</td>
293 <td class="fstest-4-7">F</td>
294 <td class="fstest-6-7">F</td>
295 <td class="fstest-7-9">F</td>
296 <td class="fstest-8-9">F</td>
297 </tr>
298 <tr class="fs5">
299 <th>5</th>
300 <td class="fstest-full">F</td>
301 <td class="fstest-1-3">F</td>
302 <td class="fstest-1-4">F</td>
303 <td class="fstest-1-5">F</td>
304 <td class="fstest-2-6">F</td>
305 <td class="fstest-4-6">F</td>
306 <td class="fstest-4-7">F</td>
307 <td class="fstest-6-7">F</td>
308 <td class="fstest-7-9">F</td>
309 <td class="fstest-8-9">F</td>
310 </tr>
311 <tr class="fs6">
312 <th>6</th>
313 <td class="fstest-full">F</td>
314 <td class="fstest-1-3">F</td>
315 <td class="fstest-1-4">F</td>
316 <td class="fstest-1-5">F</td>
317 <td class="fstest-2-6">F</td>
318 <td class="fstest-4-6">F</td>
319 <td class="fstest-4-7">F</td>
320 <td class="fstest-6-7">F</td>
321 <td class="fstest-7-9">F</td>
322 <td class="fstest-8-9">F</td>
323 </tr>
324 <tr class="fs7">
325 <th>7</th>
326 <td class="fstest-full">F</td>
327 <td class="fstest-1-3">F</td>
328 <td class="fstest-1-4">F</td>
329 <td class="fstest-1-5">F</td>
330 <td class="fstest-2-6">F</td>
331 <td class="fstest-4-6">F</td>
332 <td class="fstest-4-7">F</td>
333 <td class="fstest-6-7">F</td>
334 <td class="fstest-7-9">F</td>
335 <td class="fstest-8-9">F</td>
336 </tr>
337 <tr class="fs8">
338 <th>8</th>
339 <td class="fstest-full">F</td>
340 <td class="fstest-1-3">F</td>
341 <td class="fstest-1-4">F</td>
342 <td class="fstest-1-5">F</td>
343 <td class="fstest-2-6">F</td>
344 <td class="fstest-4-6">F</td>
345 <td class="fstest-4-7">F</td>
346 <td class="fstest-6-7">F</td>
347 <td class="fstest-7-9">F</td>
348 <td class="fstest-8-9">F</td>
349 </tr>
350 <tr class="fs9">
351 <th>9</th>
352 <td class="fstest-full">F</td>
353 <td class="fstest-1-3">F</td>
354 <td class="fstest-1-4">F</td>
355 <td class="fstest-1-5">F</td>
356 <td class="fstest-2-6">F</td>
357 <td class="fstest-4-6">F</td>
358 <td class="fstest-4-7">F</td>
359 <td class="fstest-6-7">F</td>
360 <td class="fstest-7-9">F</td>
361 <td class="fstest-8-9">F</td>
362 </tr>
363 </table>
365 <!--
367 <p>Results based on spec logic:</p>
369 <table>
370 <thead>
371 <th>width</th>
372 <th>full</th>
373 <th>1-3</th>
374 <th>1-4</th>
375 <th>1-5</th>
376 <th>2-6</th>
377 <th>4-6</th>
378 <th>4-7</th>
379 <th>6-7</th>
380 <th>7-9</th>
381 <th>8-9</th>
382 </thead>
383 <tr class="fs1">
384 <th>1</th>
385 <td class="fstest-full">1</td>
386 <td class="fstest-1-3">1</td>
387 <td class="fstest-1-4">1</td>
388 <td class="fstest-1-5">1</td>
389 <td class="fstest-2-6">2</td>
390 <td class="fstest-4-6">4</td>
391 <td class="fstest-4-7">4</td>
392 <td class="fstest-6-7">6</td>
393 <td class="fstest-7-9">7</td>
394 <td class="fstest-8-9">8</td>
395 </tr>
396 <tr class="fs2">
397 <th>2</th>
398 <td class="fstest-full">2</td>
399 <td class="fstest-1-3">1</td>
400 <td class="fstest-1-4">1</td>
401 <td class="fstest-1-5">1</td>
402 <td class="fstest-2-6">2</td>
403 <td class="fstest-4-6">4</td>
404 <td class="fstest-4-7">4</td>
405 <td class="fstest-6-7">6</td>
406 <td class="fstest-7-9">7</td>
407 <td class="fstest-8-9">8</td>
408 </tr>
409 <tr class="fs3">
410 <th>3</th>
411 <td class="fstest-full">3</td>
412 <td class="fstest-1-3">3</td>
413 <td class="fstest-1-4">1</td>
414 <td class="fstest-1-5">1</td>
415 <td class="fstest-2-6">2</td>
416 <td class="fstest-4-6">4</td>
417 <td class="fstest-4-7">4</td>
418 <td class="fstest-6-7">6</td>
419 <td class="fstest-7-9">7</td>
420 <td class="fstest-8-9">8</td>
421 </tr>
422 <tr class="fs4">
423 <th>4</th>
424 <td class="fstest-full">4</td>
425 <td class="fstest-1-3">3</td>
426 <td class="fstest-1-4">4</td>
427 <td class="fstest-1-5">1</td>
428 <td class="fstest-2-6">2</td>
429 <td class="fstest-4-6">4</td>
430 <td class="fstest-4-7">4</td>
431 <td class="fstest-6-7">6</td>
432 <td class="fstest-7-9">7</td>
433 <td class="fstest-8-9">8</td>
434 </tr>
435 <tr class="fs5">
436 <th>5</th>
437 <td class="fstest-full">5</td>
438 <td class="fstest-1-3">3</td>
439 <td class="fstest-1-4">4</td>
440 <td class="fstest-1-5">5</td>
441 <td class="fstest-2-6">2</td>
442 <td class="fstest-4-6">4</td>
443 <td class="fstest-4-7">4</td>
444 <td class="fstest-6-7">6</td>
445 <td class="fstest-7-9">7</td>
446 <td class="fstest-8-9">8</td>
447 </tr>
448 <tr class="fs6">
449 <th>6</th>
450 <td class="fstest-full">6</td>
451 <td class="fstest-1-3">3</td>
452 <td class="fstest-1-4">4</td>
453 <td class="fstest-1-5">5</td>
454 <td class="fstest-2-6">6</td>
455 <td class="fstest-4-6">6</td>
456 <td class="fstest-4-7">7</td>
457 <td class="fstest-6-7">6</td>
458 <td class="fstest-7-9">7</td>
459 <td class="fstest-8-9">8</td>
460 </tr>
461 <tr class="fs7">
462 <th>7</th>
463 <td class="fstest-full">7</td>
464 <td class="fstest-1-3">3</td>
465 <td class="fstest-1-4">4</td>
466 <td class="fstest-1-5">5</td>
467 <td class="fstest-2-6">6</td>
468 <td class="fstest-4-6">6</td>
469 <td class="fstest-4-7">7</td>
470 <td class="fstest-6-7">7</td>
471 <td class="fstest-7-9">7</td>
472 <td class="fstest-8-9">8</td>
473 </tr>
474 <tr class="fs8">
475 <th>8</th>
476 <td class="fstest-full">8</td>
477 <td class="fstest-1-3">3</td>
478 <td class="fstest-1-4">4</td>
479 <td class="fstest-1-5">5</td>
480 <td class="fstest-2-6">6</td>
481 <td class="fstest-4-6">6</td>
482 <td class="fstest-4-7">7</td>
483 <td class="fstest-6-7">7</td>
484 <td class="fstest-7-9">9</td>
485 <td class="fstest-8-9">8</td>
486 </tr>
487 <tr class="fs9">
488 <th>9</th>
489 <td class="fstest-full">9</td>
490 <td class="fstest-1-3">3</td>
491 <td class="fstest-1-4">4</td>
492 <td class="fstest-1-5">5</td>
493 <td class="fstest-2-6">6</td>
494 <td class="fstest-4-6">6</td>
495 <td class="fstest-4-7">7</td>
496 <td class="fstest-6-7">7</td>
497 <td class="fstest-7-9">9</td>
498 <td class="fstest-8-9">9</td>
499 </tr>
500 </table>
502 -->
504 </body>
505 </html>
