<style type="text/css"> p { margin-left: 11px; padding-left: 11px; } p.dotted span { text-decoration-style: dotted; } p.dashed span { text-decoration-style: dashed; } p.wavy span { text-decoration-style: wavy; } span { text-decoration: underline line-through overline; } p.relative span { position: relative; left: 13px; } p.relative2 > span { position: relative; left: 13px; text-decoration: none; } p.relative2 span span { position: relative; left: -13px; } p.shadow { color: transparent; text-shadow: 1em 0.5em black; } </style> <div style="font-size: 16px;"> <p class="dotted"> <span> </span><span> </span><span> </span><span> </span> </p> <p class="dashed"> <span> </span><span> </span><span> </span><span> </span> </p> <p class="wavy"> <span> </span><span> </span><span> </span><span> </span> </p> <p class="dotted relative"> <span> </span><span> </span><span> </span><span> </span> </p> <p class="dashed relative"> <span> </span><span> </span><span> </span><span> </span> </p> <p class="wavy relative"> <span> </span><span> </span><span> </span><span> </span> </p> <p class="dotted relative2"> <span><span> </span><span> </span><span> </span><span> </span></span> </p> <p class="dashed relative2"> <span><span> </span><span> </span><span> </span><span> </span></span> </p> <p class="wavy relative2"> <span><span> </span><span> </span><span> </span><span> </span></span> </p> <p class="dotted shadow"> <span> </span><span> </span><span> </span><span> </span> </p> <p class="dashed shadow"> <span> </span><span> </span><span> </span><span> </span> </p> <p class="wavy shadow"> <span> </span><span> </span><span> </span><span> </span> </p> </div> <div style="font-size: 32px;"> <p class="dotted"> <span> </span><span> </span><span> </span><span> </span> </p> <p class="dashed"> <span> </span><span> </span><span> </span><span> </span> </p> <p class="wavy"> <span> </span><span> </span><span> </span><span> </span> </p> <p class="dotted relative"> <span> </span><span> </span><span> </span><span> </span> </p> <p class="dashed relative"> <span> </span><span> </span><span> </span><span> </span> </p> <p class="wavy relative"> <span> </span><span> </span><span> </span><span> </span> </p> <p class="dotted relative2"> <span><span> </span><span> </span><span> </span><span> </span></span> </p> <p class="dashed relative2"> <span><span> </span><span> </span><span> </span><span> </span></span> </p> <p class="wavy relative2"> <span><span> </span><span> </span><span> </span><span> </span></span> </p> <p class="dotted shadow"> <span> </span><span> </span><span> </span><span> </span> </p> <p class="dashed shadow"> <span> </span><span> </span><span> </span><span> </span> </p> <p class="wavy shadow"> <span> </span><span> </span><span> </span><span> </span> </p> </div>