<header class="header">
<h1 class="title">Lorem ipsum</h1>
</header>
<div class="content">
<p>Dolor sit amet <a href="#">dummy link</a></p>
</div>
<footer class="footer">
<p class="disclaimer">Volupat consecturap</p>
</footer>
html {
--primary-color: blue;
--secondary-color: red;
}
* {
color: var(--text-color, black);
}
.header, .footer {
--text-color: white;
background: var(--primary-color);
}
.title {
color: var(--secondary-color);
}
a {
color: var(--primary-color);
}
a:hover {
color: var(--secondary-color);
}
This Pen doesn't use any external CSS resources.
This Pen doesn't use any external JavaScript resources.