Skip to content
Related Articles

Related Articles

How to add quotations and citations to the web pages using HTML ?

View Discussion
Improve Article
Save Article
Like Article
  • Difficulty Level : Basic
  • Last Updated : 10 Nov, 2021

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. 

1. <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.

HTML




<!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:

blockquote tag example

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.

HTML




<!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:

q tag example

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.

HTML




<!DOCTYPE html>
<html>
  
<body>
    <p>
        <abbr title="GeeksForGeeks"> GFG </abbr>
        is the best website for computer 
        science students!
    </p>
</body>
  
</html>

Output:

abbr tag example

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.

HTML




<!DOCTYPE html>
<html>
  
<body>
    <p>
        This Book was written by 
        <cite>GeeksForGeeks</cite> in 2021.
    </p>
</body>
  
</html>

Output:


My Personal Notes arrow_drop_up
Recommended Articles
Page :

Start Your Coding Journey Now!