Sometimes, we want to change the colors of specific words in a string of text with HTML and CSS.
In this article, we’ll look at how to change the colors of specific words in a string of text with HTML and CSS.
How to change the colors of specific words in a string of text with HTML and CSS?
To change the colors of specific words in a string of text with HTML and CSS, we use the mark element.
For instance, we write
<p>
Enter the competition by <mark class="red">January 30, 2022</mark> and you
could win up to $$$$ — including amazing
<mark class="blue">summer</mark> trips!
</p>
to add text wrapped with the mark element.
Then we write
mark.red {
color: #ff0000;
background: none;
}
mark.blue {
color: #0000a0;
background: none;
}
to style the mark elements with the red and blue classes.
Conclusion
To change the colors of specific words in a string of text with HTML and CSS, we use the mark element.