Quotations in HTML

Back to: HTML Tutorials

Quotations in HTML with Examples

In this article, I am going to discuss Quotations in HTML with Examples. Please read our previous article where we discussed Formatting Elements in HTML with Examples. At the end of this article, you will learn everything about HTML Quotations with Examples.

Quotations in HTML

Quotation tags are used to create quotations in HTML documents. There are numerous quotation tags, each of which serves a particular purpose and displays content in a different way.

1. <blockquote> – Quotations
2. <q> – Short Quotations
3. <abbr> – Abbreviations
4. <address> – Contact Information
5. <cite> – Work Title
6. <bdo> – Bi-Directional Override

The HTML <blockquote> Element

The <blockquote> element in HTML is used to indicate a section taken from another source. Indentation is commonly used to display blockquote elements.

Example:

<blockquote cite="https://en.wikipedia.org/wiki/Supercar">
A supercar also called exotic car is a loosely defined description of street-legal, high-performance luxury sports car. Since the 2000s or 2010s, the term hypercar has come into use for the highest performing supercars. Supercars commonly serve as the flagship model within a vehicle manufacturer's lineup of sports cars.
</blockquote>

Output:

The HTML <q> Element

The <q> element is used in HTML to add short quotations. Short quotations are enclosed by quotation marks (” “).

<p><q> No one can motivate you, until you motivate yourself. </q></p>

Output:

The HTML <abbr> Element

The <abbr> element in HTML is used to define an acronym. For example, WWW stands for the World Wide Web, and ISRO stands for the Indian Space Research Organization.

Example:

<p><abbr title=”Indian Space Research Organization”>ISRO</abbr> is the national space agency of India, headquartered in Bengaluru.</p>

The abbreviated word is displayed with a dotted underline, and when the user hovers over it, the information shows up.

The HTML <address> Element

The <address> element in HTML is used to define the contact information for a person, organization, etc. It can include Web links, Emails, Addresses, Contact Numbers, and so on. The browser inserts one line break before and after the address element. Everything inside the address element is shown in italics.

<address>
Mr John Smith <br>
132, My Street,<br>
Bigtown BG23 4YZ<br>
England
</address>

Output:

The HTML <bdo> Element

Bdo is an abbreviation for a bi-directional override. It is used to alter the Html element’s current text direction. The below example changes the text direction from right to left.

<bdo dir=”rtl”>This line will be written from right to left</bdo>

Output:

The HTML <cite> Element

The <cite> element in HTML is used to define a title for creative work such as a book title, painting title, music title, and so on. The text inside the cite element is displayed in italic by the browser.

Example:

<img src="https://m.media-amazon.com/images/I/41v9lLp-xUL.jpg" width="230" height="350" alt="book img">
<p> <cite>Life's Amazing Secrets</cite> by Gaur Gopal Das </p>

Output:

Here Life’s Amazing Secrets is a citation or title for a book written by Gaur Gopal Das.

In the next article, I am going to discuss Lists in HTML with Examples. Here, in this article, I try to explain Quotations in HTML with Examples and I hope you enjoy this HTML Quotations with Examples article.