Quotes, abbreviations and dates
No quote marks were typed: the browser added them, nested ones in single quotes, and French ones as guillemets. Hover HTML to see its tooltip.
HTML has small elements that say exactly what a piece of text is: a quotation (blockquote, q, cite), an abbreviation (abbr), contact details (address), a date (time), or computer text (code, pre, kbd, samp, var).
Change the code and press Run (Ctrl+Enter). Predict what will happen first, then break it on purpose and read what changes. Your edits are saved and match the lesson page.
Ready for more? This phase has 6 hands-on exercises with automatic checks.
Practice questions
Write the code in the editor, run it, then open the model answer to compare.
Mark up this sentence: "In the book Clean Code, the author writes: functions should do one thing." (a short in-line quote and a book title).
Write a line that shows an event at 6:30 pm on 1 May 2026 in India (UTC+05:30), shown to humans as "May Day evening".
Show the instruction "Press Ctrl+Shift+I to open DevTools" and a code block showing <h1>Hi</h1>.
Explain it without notes
What's the difference between the cite attribute and the cite element?
Why does time have a datetime attribute when the date is already written in the text?
Explain how to show a block of HTML code on a web page so it displays as text.
When would you use kbd versus samp versus code?
Preview
Console
Nothing logged yet.Expected console output
Shown: Pi Day 2026
Machine value: 2026-03-14
As a Date: 2026-03-14T00:00:00.000Z
Quote source: https://www.w3.org/standards/webdesign/accessibility