In this article, we will see how to add quotations and citations to the web pages using HTML. When we are creating a website or a blog, we face many situations where we want to highlight a certain text. We can use HTML to do the same. HTML provides us with many tags such as <blockquote>,<q>, <abbr> and <cite> to perform different types of text highlighting.
<blockquote> Tag: The <blockquote> tag in HTML is used to display long quotations, i.e., it defines a section within a document that is quoted from another source. It is a block-level element and is used generally for long quotations.
Syntax:
<blockquote> Contents... </blockquote>
Example: It is a simple example to display the usage of the <blockquote> tag.
<!DOCTYPE html><html>
<body>
<p>
This text is inside normal paragraph tag.
</p>
<!--Blockquote starts -->
<blockquote>
This text is inside blockquote tag
</blockquote>
<!--Blockquote ends -->
<p>
This text is again inside paragraph
tag, but after the blockquote tag.
</p>
</body>
</html>
|
Output:
2. <q> Tag: The <q> tag in HTML is used for short quotations. Browsers render the text written within this tag is enclosed with quotation marks. It is an inline element.
Syntax:
<q> Contents... </q>
Example: It is a simple example to display the usage of the <q> tag.
<!DOCTYPE html><html>
<body>
<p>
This text is inside normal paragraph tag.
<!--q starts -->
<q>This text is inside <q> tag</q>
<!--q ends --> This text is again inside paragraph
tag, but after the <q> tag.
</p>
</body>
</html>
|
Output:
3. <abbr> Tag: The <abbr> tag in HTML is used to define abbreviation of an element. This is a very useful tag that provides useful information to browsers, search engines, etc. This tag takes an attribute title that has the full form or actual information of the abbreviated text. This tag is an inline tag.
Syntax:
<abbr> Contents... </abbr>
Example: It is an example to display the use of <abbr> tag.
<!DOCTYPE html><html>
<body>
<p>
<abbr title="GeeksForGeeks"> GFG </abbr>
is the best website for computer
science students!
</p>
</body>
</html>
|
Output:
Note: If we hover over the abbreviated text, we will get the information written in the title attribute as a tooltip.
4. <cite> Tag: The <cite> tag in HTML is used to define the title of a work. It displays the text in italics format. This tag is also inline.
Syntax:
<cite> Contents... </cite>
Example: It is an example to display the uses of <cite> tag.
<!DOCTYPE html><html>
<body>
<p>
This Book was written by
<cite>GeeksForGeeks</cite> in 2021.
</p>
</body>
</html>
|
Output: