| <head> |
| <title>CSS Test: Text Decoration with first-line pseudo element</title> |
| <link rel="help" href="http://www.w3.org/TR/CSS21/selector.html#first-line-pseudo"> |
| <style type="text/css"> |
| #div1:first-line |
| { |
| font: 24px sans-serif; |
| color: gray; |
| letter-spacing: 5px; |
| text-decoration: underline; |
| line-height: 48px; |
| } |
| #div2:first-line |
| { |
| font: 24px sans-serif; |
| color: gray; |
| letter-spacing: 5px; |
| text-decoration: overline; |
| line-height: 48px; |
| } |
| #div3:first-line |
| { |
| font: 24px sans-serif; |
| color: gray; |
| letter-spacing: 5px; |
| text-decoration: line-through; |
| line-height: 48px; |
| } |
| div { |
| color: green; |
| } |
| p { |
| font-weight:bold; |
| } |
| |
| </style> |
| </head> |
| <body> |
| <h2>Test case for First-line text-decoration style</h2> |
| |
| <p> Text-decoration UNDERLINE : Only the first line must have an underline. |
| <div id="div1">Underline Underline Underline Underline<br> Underline Underline Underline Underline<br> Underline Underline Underline Underline </div> |
| <br> |
| </p> |
| <p> Text-decoration OVERLINE : Only the first line must have an overline. |
| <div id="div2">Overline Overline Overline Overline<br> Overline Overline Overline Overline<br> Overline Overline Overline Overline </div> |
| <br> |
| </p> |
| <p> Text-decoration LINE-THROUGH : Only the first line must have a line through it. |
| <div id="div3">Line-Through Line-Through Line-Through Line <br> Line-Through Line-Through Line-Through Line-Through<br> Line-Through Line-Through Line-Through Line-Through </div> |
| <br> |
| </p> |
| </body> |
