Highlight text with Html5 <mark> tag
If we want to highlight the text in the Html document using the <mark> tag, then we have to follow the steps which are given below. Using these steps, we can easily highlight the text.
Step 1: Firstly, we have to type the Html code in any text editor or open the existing Html file in the text editor in which we want to highlight the text.
<!Doctype Html>
<Html>
<Head>
<Title>
Highlight the text in Html
</Title>
</Head>
<Body>
The text which we want to highlight.
</Body>
</Html> Step 2: Now, we have to place the cursor at the starting of that text, which we want to highlight. And, then we have to type the opening <mark> tag. <mark> tag is a paired tag, so we have to close this tag just after that text, which we want to mark a highlight.
I Love <mark> my india.</mark> Step 3: And, at last, we have to save the Html file and then run the file in the browser.
<!Doctype Html>
<Html>
<Head>
<Title>
Highlight the text in Html
</Title>
</Head>
<Body>
I Love <mark> my India.</mark>
</Body>
</Html> The output of above Html Code is shown in the following screenshot:
Highlight text using Internal CSS
If we want to highlight the text using the Internal Cascading style sheet, then we have to follow the steps which are given below. Using these steps, we can easily highlight the text.
Step 1: Firstly, we have to type the Html code in any text editor or open the existing Html file in the text editor in which we want to highlight the text.
<!Doctype Html>
<Html>
<Head>
<Title>
Highlight the text using CSS
</Title>
</Head>
<Body>
The text which we want to highlight.
</Body>
</Html> Step 2: Now, we have to place the cursor in the head tag just after the title tag of the Html document and then define the styles inside the <style> tag as shown in the following block. And then type the background-color attribute into the class.
<Head>
<Title>
Highlight the text using CSS
</Title>
<style>
.class_name
{
background-color : yellow;
}
</style>
</Head> Step 3: Now, we have to use the class in the <span> tag for highlighting the text.
<span class="class_name"> the text we want to mark as highlight</span> Step 4: And, at last, we have to save the Html file and then run the file in the browser.
<!Doctype Html>
<Html>
<Head>
<Title>
Highlight the text using CSS
</Title>
<style>
.highlighttext
{
background-color:#FFFF00;
}
</style>
</Head>
<Body>
The text which <span class="highlighttext"> we want to highlight</span>.
</Body>
</Html> 