| <style> |
| body { |
| background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 10 10"><g fill="#ccc"><rect width="5" height="5"/><rect x="5" y="5" width="5" height="5"/></g></svg>'); |
| background-size: 100px 100px; |
| } |
| |
| p { |
| margin: 10px 0; |
| padding: 0; |
| } |
| |
| .underlined { |
| text-decoration: underline; |
| } |
| </style> |
| |
| <p>This is normal text content.</p> |
| |
| <p style="color: red;">This is colored text content with old syntax.</p> |
| <p style="color: red;">This is colored text content with old syntax <span style="color: blue;">and an inline color</span>.</p> |
| |
| <p style="color: red;">This is colored text content with color() syntax.</p> |
| <p style="color: red;">This is colored text content with color() syntax <span style="color: blue;">and an inline color</span>.</p> |
| |
| <p class="underlined" style="color: red;">This is underlined text content with old syntax.</p> |
| <p class="underlined" style="color: red;">This is colored text content with old syntax <span style="color: blue;">and an inline color</span>.</p> |
| |
| <p class="underlined" style="color: red;">This is underlined text content with color() syntax.</p> |
| <p class="underlined" style="color: red;">This is colored text content with color() syntax <span style="color: blue;">and an inline color</span>.</p> |
| |
| <p class="underlined" style="color: red; -webkit-text-decoration-style: double;">This is underlined text content with old syntax and a different underline style.</p> |
| <p class="underlined" style="color: red; -webkit-text-decoration-style: wavy;">This is underlined text content with old syntax and a different underline style.</p> |
| <p class="underlined" style="color: red; -webkit-text-decoration-style: dotted;">This is underlined text content with old syntax and a different underline style.</p> |
| |
| <p class="underlined" style="color: red; -webkit-text-decoration-style: double;">This is underlined text content with color() syntax and a different underline style.</p> |
| <p class="underlined" style="color: red; -webkit-text-decoration-style: wavy;">This is underlined text content with color() syntax and a different underline style.</p> |
| <p class="underlined" style="color: red; -webkit-text-decoration-style: dotted;">This is underlined text content with color() syntax and a different underline style.</p> |
| |