complex-decoration-style-quirks-ref.html (2039B)
1 <style type="text/css"> 2 p { 3 margin-left: 11px; 4 padding-left: 11px; 5 } 6 p.dotted span { 7 text-decoration-style: dotted; 8 } 9 p.dashed span { 10 text-decoration-style: dashed; 11 } 12 p.wavy span { 13 text-decoration-style: wavy; 14 } 15 span { 16 text-decoration: underline line-through overline; 17 } 18 p.relative { 19 margin-left: 24px; 20 } 21 p.shadow span { 22 position: relative; 23 left: 1em; 24 top: 0.5em; 25 } 26 </style> 27 <div style="font-size: 16px;"> 28 <p class="dotted"> 29 <span> </span> 30 </p> 31 <p class="dashed"> 32 <span> </span> 33 </p> 34 <p class="wavy"> 35 <span> </span> 36 </p> 37 <p class="dotted relative"> 38 <span> </span> 39 </p> 40 <p class="dashed relative"> 41 <span> </span> 42 </p> 43 <p class="wavy relative"> 44 <span> </span> 45 </p> 46 <p class="dotted"> 47 <span> </span> 48 </p> 49 <p class="dashed"> 50 <span> </span> 51 </p> 52 <p class="wavy"> 53 <span> </span> 54 </p> 55 <p class="dotted shadow"> 56 <span> </span> 57 </p> 58 <p class="dashed shadow"> 59 <span> </span> 60 </p> 61 <p class="wavy shadow"> 62 <span> </span> 63 </p> 64 </div> 65 <div style="font-size: 32px;"> 66 <p class="dotted"> 67 <span> </span> 68 </p> 69 <p class="dashed"> 70 <span> </span> 71 </p> 72 <p class="wavy"> 73 <span> </span> 74 </p> 75 <p class="dotted relative"> 76 <span> </span> 77 </p> 78 <p class="dashed relative"> 79 <span> </span> 80 </p> 81 <p class="wavy relative"> 82 <span> </span> 83 </p> 84 <p class="dotted"> 85 <span> </span> 86 </p> 87 <p class="dashed"> 88 <span> </span> 89 </p> 90 <p class="wavy"> 91 <span> </span> 92 </p> 93 <p class="dotted shadow"> 94 <span> </span> 95 </p> 96 <p class="dashed shadow"> 97 <span> </span> 98 </p> 99 <p class="wavy shadow"> 100 <span> </span> 101 </p> 102 </div>