standards-decorations-ref.html 1.5 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273
  1. <!DOCTYPE HTML>
  2. <!--
  3. Any copyright is dedicated to the Public Domain.
  4. http://creativecommons.org/licenses/publicdomain/
  5. -->
  6. <html><head>
  7. <title>text-overflow: Standards mode text-decorations</title>
  8. <style type="text/css">
  9. @font-face {
  10. font-family: Ahem;
  11. src: url(../fonts/Ahem.ttf);
  12. }
  13. @font-face {
  14. font-family: DejaVuSansMono;
  15. src: url(../fonts/DejaVuSansMono.woff);
  16. }
  17. html,body {
  18. color:black; background-color:white; font-size:16px; padding:0; margin:0; font-family:DejaVuSansMono;
  19. }
  20. .test {
  21. overflow:hidden;
  22. float:left;
  23. height:2em;
  24. white-space:pre;
  25. margin-left:1em;
  26. margin-bottom:1em;
  27. font-size:20px;
  28. color:blue;
  29. }
  30. span {
  31. font-size:16px;
  32. color:black;
  33. }
  34. .xspan {
  35. text-decoration: line-through;
  36. }
  37. .t1 .xspan {
  38. }
  39. .rlo {
  40. unicode-bidi: bidi-override; direction:rtl;
  41. }
  42. .lro {
  43. unicode-bidi: bidi-override;
  44. }
  45. .rtl {
  46. direction:rtl;
  47. }
  48. .ltr {
  49. direction:ltr;
  50. }
  51. .t1 { width:7.3em;}
  52. .t2 { width:20px;}
  53. .t3 { width:22px;}
  54. .t4 { width:1px; font-family:Ahem; }
  55. .t3 span {margin-left:14px; }
  56. m { font-size:20px; color:blue; }
  57. </style>
  58. </head><body>
  59. <div class="test t1"><span><span class="xspan">0123&nbsp;56789012</span><m>&#x2026;</m></span></div>
  60. <div class="test rtl t1"><span><span class="xspan">1&nbsp;56789012345</span><m>&#x2026;</m></span></div>
  61. <div class="test t2" style="color:black"><span class="xspan">xxxx</span></div>
  62. <div class="test t3"><span class="xspan">x</span></div>
  63. <div class="test t4"><span class="xspan">x</span></div>
  64. </body>
  65. </html>