text-decoration-style-inherit-simple-underlines.html

<!DOCTYPE html>
<style>
/* Make decorations bigger so they are easier to see */
body {
  font-size: 15px;
  text-decoration-skip-ink: none;
}
body > div {
  margin-bottom: 15px;
}
</style>

<!-- Special optimization for 'simple' underlines -->
<div style="text-decoration: underline;">
  Solid black underline.
</div>

<div style="text-decoration: underline overline;">
  <div style="text-decoration: underline wavy green;">
     Solid black overline, solid black underline with wavy green underline on top.
  </div>
</div>

<div style="text-decoration: underline wavy green;">
  <div>
    <div style="text-decoration: underline;">
       Wavy green underline, solid black underline on top.
    </div>
  </div>
</div>

<div style="text-decoration: underline;">
  <div>
    <div style="text-decoration: underline wavy green;">
       Solid black underline, wavy green underline on top.
    </div>
  </div>
</div>

<div style="text-decoration: underline wavy red;">
  <div style="text-decoration: underline;">
     Wavy red underline, solid black underline on top.
  </div>
</div>

<div style="text-decoration: underline wavy red; color: blue;">
  <div style="text-decoration: underline;">
     Wavy red underline, solid blue underline on top, blue text.
  </div>
</div>

chromium/third_party/blink/web_tests/fast/css3-text/css3-text-decoration/text-decoration-style-inherit-simple-underlines.html