| <!DOCTYPE html> |
| <html> |
| <head> |
| <!-- Bugzilla link: http://webkit.org/b/94094 --> |
| <title>CSS Test: CSS3 text-decoration-style</title> |
| <link rel="help" href="http://http://dev.w3.org/csswg/css3-text/#text-decoration-style"/> |
| <meta name="flags" content="ahem"/> |
| <style> |
| div { padding: 10px; diplay: inline; text-decoration-skip-ink: none; } |
| div.solid { border: 5px solid; } |
| div.double { border: 5px double; } |
| div.dashed { border: 5px dashed; } |
| div.dotted { border: 5px dotted; } |
| span.underline { text-decoration-line: underline; } |
| span.overline { text-decoration-line: overline; } |
| span.line-through { text-decoration-line: line-through; } |
| span.solid { text-decoration-style: solid; } |
| span.double { text-decoration-style: double; } |
| span.dashed { text-decoration-style: dashed; } |
| span.dotted { text-decoration-style: dotted; } |
| span.wavy { text-decoration-style: wavy; } |
| </style> |
| </head> |
| <body style="font: 20px Ahem; -webkit-font-smoothing: none; -webkit-text-stroke: 1px black; -webkit-text-fill-color: white;"> |
| <div class="solid"><span class="underline solid">lorem ipsum</span> <span class="overline solid">lorem ipsum</span> <span class="line-through solid">lorem ipsum</span></div><br/> |
| <div class="double"><span class="underline double">lorem ipsum</span> <span class="overline double">lorem ipsum</span> <span class="line-through double">lorem ipsum</span></div><br/> |
| <div class="dashed"><span class="underline dashed">lorem ipsum</span> <span class="overline dashed">lorem ipsum</span> <span class="line-through dashed">lorem ipsum</span></div><br/> |
| <div class="dotted"><span class="underline dotted">lorem ipsum</span> <span class="overline dotted">lorem ipsum</span> <span class="line-through dotted">lorem ipsum</span></div><br/> |
| <div><span class="underline wavy">lorem ipsum</span> <span class="overline wavy">lorem ipsum</span> <span class="line-through wavy">lorem ipsum</span></div> |
| </body> |
| </html> |
