![Trending Articles on Technical and Non Technical topics](/images/trending_categories.jpeg)
Data Structure
Networking
RDBMS
Operating System
Java
MS Excel
iOS
HTML
CSS
Android
Python
C Programming
C++
C#
MongoDB
MySQL
Javascript
PHP
Physics
Chemistry
Biology
Mathematics
English
Economics
Psychology
Social Studies
Fashion Studies
Legal Studies
- Selected Reading
- UPSC IAS Exams Notes
- Developer's Best Practices
- Questions and Answers
- Effective Resume Writing
- HR Interview Questions
- Computer Glossary
- Who is Who
Highlight HTML content for reference purposes
The <mark> tag is used to mark or highlight the text in HTML. It is one of the new tags used in HTML5.
It supports global and event attributes.
we can include <mark> tag in between the statement also, like −
<p>I play with <mark> Coding</mark> </p>
Syntax
Following is the syntax of <mark> tag in HTML document −
<mark> Contents... </mark>
Example
In the following HTML example, we are trying to print some text and highlighting it using the <mark> tag in HTML -
<!DOCTYPE html> <html> <body> <h1 style="color: blue;">TutorialsPoint</h1> <h2>Using Mark Tags</h2> <p> <mark>TutorialsPoint:</mark> is a leading <mark>Ed Tech company</mark> Where all computer related Courses are provided. </p> </body> </html>
Applying CSS to <mark> tag
Many browsers display the <mark> element by applying some default values.
Syntax
Following is the syntax of style in HTML −
mark { background-color: orange; color: black; }
Example
In this example we are trying to mark the content in a document using CSS −
<!DOCTYPE html> <html> <head> <style> mark { background-color: orange; color: black; } </style> </head> <body> <p>A mark Display's Like This:</p> <mark>TutorialsPoint:</mark> is a leading <mark>Ed Tech company</mark> <p>Where all computer related Courses are provided.</p> <p>TO see effects, <mark>change the default CSS settings.</mark></p> </body> </html>
Example
Following is another example −
<!DOCTYPE html> <html> <head> <style> mark.orange { background-color: orange; color: white; } mark.pink { background-color: pink; } mark.lime { background-color: lime; } </style> </head> <body> <p>A mark Display's Like This:</p> <mark class="pink">TutorialsPoint:</mark> is a leading <mark class="orange">Ed Tech company</mark> <p>Where all computer related Courses are provided.</p> <p>TO see effects, <mark class="lime">change the default CSS settings</mark>. </p> </body> </html>
Advertisements