Quoting in HTML5 is as simple as tagging the quoted text with the inline <q> tag. The cite
attribute of the <q>
tag specifies the source URL of a quote.
Required knowledge:
1. Syntax
The below code:
<p><q cite="https://creativecommons.org/about/">Creative Commons is a nonprofit organization that helps overcome legal obstacles to the sharing of knowledge and creativity to address the world’s pressing challenges.</q></p>
Results in:
Creative Commons is a nonprofit organization that helps overcome legal obstacles to the sharing of knowledge and creativity to address the world’s pressing challenges.
“Technology is a useful servant but a dangerous master.”
Christian Lous Lange, Historian
2. Style
The example below demonstrates the default style for a quote: the text is inserted in quotes. This is fairly boring and easily styled using CSS.
See the Pen HTML’s <q> tag by David Fox (@foxbeefly) on CodePen.
References:
- HTML <q> Tag (no date) HTML q tag. Available at: https://www.w3schools.com/tags/tag_q.asp (Accessed: 6 November 2023).
- Systems, K. C. (2023) Ten inspirational tech quotes, Kerridge Commercial Systems Global. Kerridge Commercial Systems Ltd. Available at: https://www.kerridgecs.com/blog/ten-inspirational-tech-quotes (Accessed: 6 November 2023).