stretchmapping-reverse.html 2.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102
  1. <!DOCTYPE HTML>
  2. <html>
  3. <head>
  4. <title>Assure OS/2 usWidthClass isn't referenced</title>
  5. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  6. <style type="text/css">
  7. @font-face {
  8. font-family: fstest-full;
  9. src: url(../fonts/csstest-widths-wd9.ttf);
  10. font-stretch: ultra-condensed;
  11. }
  12. @font-face {
  13. font-family: fstest-full;
  14. src: url(../fonts/csstest-widths-wd8.ttf);
  15. font-stretch: extra-condensed;
  16. }
  17. @font-face {
  18. font-family: fstest-full;
  19. src: url(../fonts/csstest-widths-wd7.ttf);
  20. font-stretch: condensed;
  21. }
  22. @font-face {
  23. font-family: fstest-full;
  24. src: url(../fonts/csstest-widths-wd6.ttf);
  25. font-stretch: semi-condensed;
  26. }
  27. @font-face {
  28. font-family: fstest-full;
  29. src: url(../fonts/csstest-widths-wd5.ttf);
  30. font-stretch: normal;
  31. }
  32. @font-face {
  33. font-family: fstest-full;
  34. src: url(../fonts/csstest-widths-wd4.ttf);
  35. font-stretch: semi-expanded;
  36. }
  37. @font-face {
  38. font-family: fstest-full;
  39. src: url(../fonts/csstest-widths-wd3.ttf);
  40. font-stretch: expanded;
  41. }
  42. @font-face {
  43. font-family: fstest-full;
  44. src: url(../fonts/csstest-widths-wd2.ttf);
  45. font-stretch: extra-expanded;
  46. }
  47. @font-face {
  48. font-family: fstest-full;
  49. src: url(../fonts/csstest-widths-wd1.ttf);
  50. font-stretch: ultra-expanded;
  51. }
  52. body {
  53. margin: 50px;
  54. }
  55. p.test {
  56. font-family: fstest-full;
  57. font-size: 24px;
  58. }
  59. .fs9 { font-stretch: ultra-condensed; }
  60. .fs8 { font-stretch: extra-condensed; }
  61. .fs7 { font-stretch: condensed; }
  62. .fs6 { font-stretch: semi-condensed; }
  63. .fs5 { font-stretch: normal; }
  64. .fs4 { font-stretch: semi-expanded; }
  65. .fs3 { font-stretch: expanded; }
  66. .fs2 { font-stretch: extra-expanded; }
  67. .fs1 { font-stretch: ultra-expanded; }
  68. </style>
  69. </head>
  70. <body>
  71. <p>The numbers below should appear in ascending sequence:</p>
  72. <p class="test">
  73. <span class="fs1">F</span>
  74. <span class="fs2">F</span>
  75. <span class="fs3">F</span>
  76. <span class="fs4">F</span>
  77. <span class="fs5">F</span>
  78. <span class="fs6">F</span>
  79. <span class="fs7">F</span>
  80. <span class="fs8">F</span>
  81. <span class="fs9">F</span>
  82. </p>
  83. </body>
  84. </html>