How to Highlight text in HTML

A website’s main and most important component is text. Reading long texts can be tedious at times, making visitors lazy to read them. Highlighting important text from a large text block is the best way to show it. So, in this article, you will learn about HTML text highlighting.

To highlight the text, we will need of <mark> tag, that highlights the text with the default yellow background, and black text.

How <mark> tag will work:

<p>This is <mark>highlighted text</mark> using mark tag.</p>

This is highlighted text using mark tag.

It can be even styled,

mark{
  background-color: #7AFEE0;
  font-weight: bold;
}

See the Pen by Dhairya Shah (@dhairyathedev) on CodePen.

Here’s another example:

See the Pen by Dhairya Shah (@dhairyathedev) on CodePen.

Thanks for reading

Follow me on Twitter

Thanks for reading!