WS WhereIsStuff
Tutorial Guides
Log In Sign Up

Advertisement

Google Ad Slot: content-top

Quotation and Citation Elements

Previous Next

In HTML, quotation and citation elements are used to represent quotes and references within a document. These elements help provide semantic meaning to text, indicating that certain content is a quote or a citation, and they are often styled differently by default in browsers.


HTML Quotation and Citation Tags List

  • HTML <q> Tag
  • HTML <blockquote> Tag
  • HTML <cite> Tag
  • HTML <address> Tag
  • HTML <bdo> Tag
  • HTML <abbr> Tag

Inline Quotation : <q>

The <q> element is used for short, inline quotations. It is typically used for quoting a few words or a single sentence within a paragraph

Example
<p>Steve Jobs once said, <q cite="https://www.example.com/article">"The only way to do great work is to love what you do."</q></p>
Try it yourself

Block-level Quotation : <blockquote>

The <blockquote> element is used for longer, block-level quotations. It is typically used when quoting a paragraph or multiple sentences

Example
<blockquote cite="https://www.example.com/article">
"The only way to do great work is to love what you do."
</blockquote>
Try it yourself

Citation : <cite>

The <cite> element is used to reference the title of a creative work, such as a book, article, poem, movie, or artwork

Example
<p>One of the most influential books is <cite>The Art of War</cite> by Sun Tzu.</p>
Try it yourself

Abbreviation : <abbr>

The <abbr> element represents an abbreviation or acronym. It helps browsers and assistive technologies understand abbreviated text. A title attribute is often used to specify the full term when the user hovers over the abbreviation.

Example
<p>The organization is known as <abbr title="World Health Organization">WHO</abbr>.</p>
Try it yourself

Contact Information : <address>

The <address> element is used to provide contact information for a person, organization, or website. It usually contains physical addresses, email addresses, phone numbers, or links to social media profiles.

Example
<address>
Contact us at: <br>
123 Main Street, Springfield, IL 62704 <br>
<a href="mailto:info@example.com">info@example.com</a>
</address>
Try it yourself

Bidirectional Override : <bdo>

The <bdo> element is used to override the text direction for its content. It is particularly useful in cases where the default text direction (left-to-right or right-to-left) needs to be reversed.

Example
<p>Normal text: Hello, World!</p>
<p>Reversed text: <bdo dir="rtl">Hello, World!</bdo></p>
Try it yourself

Previous Next