HTML Tutorial
HTML Quotations
blockquote, q, abbr, and cite mark quotes and references so they are more than plain text.
Quotes as markup
You can type quotation marks in a paragraph. The tags in this chapter go further: they name a block quote, a short inline quote, an abbreviation, a title of a work, or contact details. Browsers and assistive tools can treat those as quotes and references, not as ordinary sentences.
Click Try it in HTML under an example. That opens /html/try — a live page preview.
blockquote
<blockquote> is for a quotation that stands as its own block, usually from another source. Browsers indent it by default. Put the quoted paragraphs inside it. The optionalcite attribute holds a URL for the source; it is not shown as visible text.
Example
<blockquote cite="https://www.example.com/letter">
<p>We will open the bridge at dawn if the wind drops.</p>
</blockquote>q for a short quote
<q> is an inline quotation. Many browsers add quotation marks for you, so you do not type extra " characters around it. Use it for a short phrase inside a sentence. Use blockquote when the quote is a whole paragraph or more.
Example
<p>The keeper said <q>the lamp is lit</q> and closed the door.</p>abbr and title
<abbr> marks an abbreviation or acronym. The title attribute holds the expansion. On a desktop browser, hovering often shows that text. Screen readers can announce the abbreviation as a distinct run of text.
Example
<p>
The <abbr title="HyperText Markup Language">HTML</abbr> file is in the project folder.
</p>Expand the term in visible text the first time if the audience may not know it. titlealone is easy to miss on a phone, where there is no hover.
cite
<cite> is the title of a work: a book, paper, film, or song. Browsers often italicize it. It is not for a person’s name. For a person, write the name in ordinary text, or use other patterns when you discuss authors in a bibliography.
Example
<p>The recipe is from <cite>Coastal Baking</cite>.</p>Do not confuse the cite element with the cite attribute onblockquote and q. The attribute is a URL. The element is visible title text.
address
<address> is contact information for the nearest article or for the whole page — typically an author or site owner. It is not a generic wrapper for any postal address in the middle of a story. Browsers often italicize it.
Example
<address>
Editorial desk<br>
<a href="mailto:desk@example.com">desk@example.com</a>
</address>bdo, bidirectional override
<bdo> overrides the text direction. Set dir="rtl" for right-to-left or dir="ltr" for left-to-right. Use it when a short run must display opposite to the surrounding paragraph, not as a styling trick.
Example
<p>The code reads <bdo dir="rtl">HTML</bdo> in reverse.</p>Quick reference
| Tag | Use |
|---|---|
| blockquote | A quoted block, often with a cite URL |
| q | A short inline quote |
| abbr | Abbreviation; title holds the expansion |
| cite | Title of a work |
| address | Contact for the page or article |
| bdo | Force text direction with dir |
Decorative quotation marks around a slogan are not a reason to use blockquote. Reserve that tag for content you are actually quoting.
Worked examples
The short listings above show the tag in isolation. These pages use the same markup on documents you would actually publish: a lab report, a clinic form, a timetable, a weather card.
HTML does not calculate. It names the pieces so a browser, a screen reader, and a search engine can tell a heading from a paragraph. The numbers below are classroom values — the same Ohm, pH, and pulse figures as the C track — now sitting in real page structure.
Preview them in the HTML editor at /html/try. Change a heading or a number and watch the page, not a print log.
Physics
Newton in a block quote
blockquote is a long quotation set apart from your own prose. cite on the element (or a cite tag inside) names the source. q is a short inline quote with browser quotation marks.
Do not use blockquote for a pretty indented box. That is CSS. The tag means “someone else wrote this.”
F = m a
Example
<blockquote>
<p>The change of motion is proportional to the motive force impressed.</p>
<p><cite>Newton, Principia</cite></p>
</blockquote>
<p>In symbols we write <q>F = m a</q> for constant mass.</p>Chemistry
An abbreviation with a title
abbr with title expands the letters on hover and for assistive tech. DNA, HTML, and pH are abbreviations. Write the expansion once so the page is not a private code.
Example
<p>
<abbr title="deoxyribonucleic acid">DNA</abbr>
and
<abbr title="potential of hydrogen">pH</abbr>
are both abbreviations.
</p>