<button class="c-initial">Color initial</button>
<button class="c-inherit">Color inherit</button>
<button class="c-unset">Color unset</button>
<hr>
<div class="c-blue">
<button class="c-initial">Color initial</button>
<button class="c-inherit">Color inherit</button>
<button class="c-unset">Color unset</button>
<p>The parent container has the color blue declaration.</p>
</div>
button {
font-size: 1.4rem;
}
p {
font-size: 1.2rem;
}
.c-blue {
color: blue;
}
.c-initial {
color: initial;
}
.c-inherit {
color: inherit;
}
.c-unset {
color: unset;
}
This Pen doesn't use any external CSS resources.
This Pen doesn't use any external JavaScript resources.