Learn with us

HTML provides several elements that are specifically designed for representing quotations and citations within web pages. Here are the commonly used quotation and citation elements in HTML:

1. <blockquote>: Represents a block-level quotation from another source. By default, it indents the content and may render with quotation marks.

<blockquote>
  <p>This is a blockquote.</p>
  <footer>Quoted from <cite>Source</cite></footer>
</blockquote>

2. <q>: Represents a short inline quotation. By default, it renders the quotation within quotation marks.

<p>She said, <q>This is a short quotation.</q></p>

3. <cite>: Specifies the title or source of a work, such as a book, article, or publication.

<p>According to <cite>The New York Times</cite>, the event was a success.</p>

4. <abbr>: Represents an abbreviated form of a longer word or phrase. The title attribute provides the full expansion or explanation of the abbreviation.

<p>The <abbr title="World Health Organization">WHO</abbr> is a specialized agency of the United Nations.</p>

5. <dfn>: Represents the defining instance of a term within a document. It is commonly used in glossaries or definitions.

<p>The <dfn>HTML</dfn> stands for HyperText Markup Language.</p>

6. <cite> and <bdo>: Together, these elements can be used to represent citations in different languages or text directions. <bdo> is used to override the text directionality.

<cite><bdo dir="rtl">قالوا أنها جميلة</bdo></cite>

These elements provide semantic meaning to quotations and citations, aiding in proper interpretation by assistive technologies and search engines. By using these elements appropriately, you can improve the accessibility, structure, and clarity of your content.