In this chapter we will go through the HTML Quotation and Citation Elements like <blockquote>
,<q>
, <abbr>
, <address>
, <cite>
, and <bdo>
.
Example
Here is a quote about FoxTutorials:
At Fox tutorials, you can learn HTML, JavaScript, AJAX, PHP, MySql and many other useful Tutorials to create website step by step. These all tutorials are absolutely free.
HTML <blockquote> for Quotations
The HTML <blockquote>
element defines a section that is quoted from another source.
Browsers usually indent <blockquote>
elements.
Example
<p>Here is a quote about FoxTutorials:</p>
<blockquote cite=”http://foxtutorials.com”>
At Fox tutorials, you can learn HTML, JavaScript, AJAX, PHP, MySql and many other useful Tutorials to create website step by step. These all tutorials are absolutely free.
</blockquote>
HTML <q> for Short Quotations
The HTML <q>
tag defines a short quotation.
Browsers normally insert quotation marks around the quotation.
Example
<p>FoxTutorials goal is to: <q>To provide step by step web development tutorials for free.</q></p>
HTML <abbr> for Abbreviations
The HTML <abbr>
tag defines an abbreviation or an acronym, like “HTML”, “CSS”, “Mr.”, “Dr.”, “ASAP”, “ATM”.
Marking abbreviations can give useful information to browsers, translation systems and search-engines.
Tip: Use the global title attribute to show the description for the abbreviation/acronym when you mouse over the element.
Example
<p>The <abbr title=”HTML Tutorials”>FoxTutorials</abbr> provides tutorials for free.</p>
HTML <address> for Contact Information
The HTML <address>
tag defines the contact information for the author/owner of a document or an article.
The text in the <address>
element usually renders in italic, and browsers will always add a line break before and after the <address>
element.
The contact information can be an email address, URL, physical address, phone number, social media handle, etc.
Example
<address>
Written by Steve Blair.<br>
Visit us at:<br>
Example.com<br>
Box 564, Hollywood<br>
USA
</address>
HTML <cite> for Work Title
The HTML <cite>
tag defines the title of a creative work (e.g. a book, a poem, a song, a movie, a painting, a sculpture, etc.).
Note: A person’s name is not the title of a work.
The text in the <cite>
element usually renders in italic.
Example
<p><cite>The Scream</cite> by Edvard Munch. Painted in 1893.</p>
HTML <bdo> for Bi-Directional Override
BDO stands for Bi-Directional Override.
The HTML <bdo>
tag is used to override the current text direction:
Example
<bdo dir=”rtl”>This text will be written from right to left</bdo>
HTML Quotation and Citation Elements
Tag | Description |
---|---|
<abbr> | Defines an abbreviation or acronym |
<address> | Defines contact information for the author/owner of a document |
<bdo> | Defines the text direction |
<blockquote> | Defines a section that is quoted from another source |
<cite> | Defines the title of a work |
<q> | Defines a short inline quotation |