third_party/WebKit/LayoutTests/fast/css/first-line-text-decoration-inherited-from-parent.html

   1 <head>
   2     <title>CSS Test: Text Decoration with first-line pseudo element inherited from Parent Block</title>
   3     <link rel="help" href="http://www.w3.org/TR/CSS21/selector.html#first-line-pseudo">
   4     <style type="text/css">
   5     div:first-line{
   6         font: 24px sans-serif;
   7         color: gray;
   8         letter-spacing: 5px;
   9         line-height: 48px;
  10     }
  11     div {
  12         color:red;
  13     }
  14
  15      #div1:first-line{
  16         text-decoration: underline;
  17     }
  18     #div2:first-line{
  19         text-decoration: overline;
  20     }
  21     #div3:first-line{
  22         text-decoration: line-through;
  23     }
  24
  25     #div1{
  26         text-decoration: underline;
  27     }
  28     #div2{
  29         text-decoration: overline;
  30         }
  31     #div3{
  32         text-decoration: line-through;
  33     }
  34
  35     p {
  36         font-weight:bold;
  37     }
  38     div p {
  39         font-weight:bold;
  40         color:green;
  41     }
  42     </style>
  43 </head>
  44 <body>
  45         <h3>Test case for First-line text-decoration style inherited from Parent Block</h3>
  46         <p> The First line text and its text-decoration must be of the same color.</p>
  47
  48         <div id="div1"><p>Underline Underline Underline Underline<br> Underline Underline Underline Underline<br> </p>Underline Underline Underline Underline </div>
  49         <br>
  50         <div id="div2"><p>Overline Overline Overline Overline<br> Overline Overline Overline Overline<br></p> Overline Overline Overline Overline </div>
  51         <br>
  52         <div id="div3"><p>Line-Through Line-Through Line-Through Line <br> Line-Through Line-Through Line-Through Line-Through<br> </p>Line-Through Line-Through Line-Through Line-Through </div>
  53         <br>
  54 </body>