HTML Quotation Tag
The use of quotations is common in textual content. HTML provides specific tags to handle this:- `<blockquote>` for block quotations and `<q>` for inline quotations. In this blog, we'll explore these tags, their attributes, and how to style them.
What Are blockquote and q Tags
The <blockquote> and <q> tags serve to define quotations in HTML. While <blockquote> is used for longer, block-level quotes, <q> is used for shorter, inline quotes.
Why Use These Tags
They provide semantic meaning to your quotations, making it easier for search engines to understand the context and relevance of the content.
Basic Syntax
blockquote Tag
<blockquote cite="source-url">Quotation text here.</blockquote>q Tag
<q cite="source-url">Quotation text here.</q>Attributes
Both <blockquote> and <q> tags support the cite attribute:
cite: Specifies the URL of the quote's source.
Practical Examples
Using blockquote for Long Quotes
<blockquote cite="https://example.com">
This is a long quote from an external source. This quote can span multiple lines and paragraphs.
</blockquote>Using q for Short, Inline Quotes
The philosopher said, <q cite="https://example.com">The unexamined life is not worth living.</q>Styling with CSS
You can style these tags using CSS to better match the aesthetics of your website.
Conclusion
The <blockquote> and <q> tags are essential for marking up quotations in HTML. They provide semantic meaning to your content and help search engines understand the context of your quotes. Use them wisely to enhance the readability and accessibility of your web pages.
How is this guide?
Sign in to share your feedback
Help us improve by sharing your thoughts on this guide.
Last updated on
Obsolete HTML Tags
As HTML has evolved, some tags have been deprecated or become obsolete. While modern browsers might still support them, their use is discouraged in favor of CSS or more semantic HTML5 elements. In this blog, we'll explore some of these obsolete tags and their modern alternatives.
HTML Semantic Tag
HTML5 introduced a range of semantic tags that provide meaning to the structure of web content. This blog will guide you through the importance and usage of these tags.