Skip to main content

HTML Quotation and Citation Elements

This chapter will go over the HTML elements <blockquote>,<q>,<abbr>,<address>, <cite> and <bdo>.

HTML <blockquote> for Quotations​

The HTML <blockquote> element specifies a section that is taken from another source and quoted.

<Blockquote> elements are typically indented by browsers.

Example
<p>Quote by Henry Van Dyke</p>

<blockquote cite="http://www.worldwildlife.org/who/index.html">
  For 50 years, WWF has been protecting the future of nature. The world's
  leading conservation organization, WWF works in 100 countries and is supported
  by 1.2 million members in the United States and close to 5 million globally.
</blockquote>
Loading...

HTML <q> for Quick Quotes​

A short quotation is defined by the HTML <q> tag.

Browsers typically surround the quotation with quotation marks.

Example
<p>A quote by James M. Barrie: <q>Life is a long lesson in humility</q></p>
Loading...

HTML <abbr> for Abbreviations​

The HTML <abbr> tag specifies an abbreviation or acronym, such as "HTML," "CSS," "Mr.", "Dr.", "ASAP," or "ATM."

Browsers, translation systems, and search engines can benefit from marking abbreviations.

tip

Use the global title attribute to show the description for the abbreviation/acronym when you mouse over the element.

example
<p>
  The first <abbr title="Automated teller machine">ATM</abbr>in India was set up
  in 1987 by HSBC in Mumbai.
</p>
Loading...

HTML <address> for Contact Information​

The HTML <address> tag specifies the contact information for a document's or article's author/owner.

Contact information can include an email address, a URL, a physical address, a phone number, a social media handle, and so on.

The text in the address> element is typically rendered in italics, and browsers always add a line break before and after the address> element.

Example
<address>
  Written by John Doe.<br />
  Visit us at:<br />
  Example.com<br />
  Box 564, Disneyland<br />
  USA
</address>
Loading...

HTML <cite> for Work Title​

The title of a creative work is specified via the HTML <citation>tag (e.g. a book, a poem, a song, a movie, a painting, a sculpture, etc.).

note

The title of a work is not the name of the author.

Italic text normally appears where the citation element is present.

Example
<p><cite>Mona Lisa</cite> by Leonardo da Vinci. Painted in 1503.</p>
Loading...

HTML <bdo> for Bi-Directional Override​

BDO is an abbreviation for Bi-Directional Override.

The HTML <bdo> element is used to change the text direction:

Example
<bdo dir="rtl">This text will be written from right to left</bdo>
Loading...