HTML · Chapter 10 of 45
HTML Quotations and Citations
HTML has specific tags for quoting text: <blockquote> for long, block-level quotations, and <q> for short inline quotes that browsers automatically wrap in quotation marks.
The <cite> tag references the title of a creative work, while <abbr> marks up abbreviations with a full explanation available on hover.
Syntax
<blockquote cite="source">Quote</blockquote>Block vs inline quotes
<blockquote> is typically indented and used for longer quoted passages, often with a cite attribute linking to the source. <q> is for short quotes within a sentence.
Abbreviations and citations
<abbr title="..."> shows a tooltip with the full term. <cite> denotes the title of a referenced work like a book or article.
Example 1 (html)
<blockquote cite="https://example.com">
The only way to do great work is to love what you do.
</blockquote>Output
The only way to do great work is to love what you do.Blockquotes are usually indented visually by default browser styles.
Example 2 (html)
<p>She said <q>HTML is fun</q> during class.</p>
<abbr title="HyperText Markup Language">HTML</abbr>Output
She said "HTML is fun" during class. HTML<q> auto-adds quote marks; <abbr> shows a tooltip on hover.
Key points
- <blockquote> is for long, block-level quotations.
- <q> is for short inline quotes, auto-adds quote marks.
- <cite> references the title of a work.
- <abbr title="..."> provides a tooltip explaining abbreviations.
💡 Note: The cite attribute is not displayed but helps document the quote's source for tools and search engines.