Introduction
The <mark>
element in HTML is used to highlight or mark portions of text within a document. It’s typically used to denote sections of text that are particularly relevant or important, similar to highlighting text with a marker on a printed document.
Here’s a simple example of how the <mark>
element can be used:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<p>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Cum quisquam iure <mark>numquam porro aspernatur totam consectetur quae corporis quos sapiente debitis</mark>, molestiae vitae ipsam ipsa quo suscipit! Maxime, ipsa suscipit.</p>
</body>
</html>
Output :
In this example:
- The
<p>
element contains a sentence of text. - When rendered in a browser, the text inside the
<mark>
element will typically be highlighted, making it stand out from the surrounding text.
The <mark>
element is primarily used for styling purposes to visually distinguish specific portions of text. It doesn’t inherently imply any semantic meaning beyond indicating that the marked text is somehow noteworthy.
We can also change the written style and colour of highlighter by CSS.