<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>