About Lesson
Definition:
In HTML5, the <blockquote>
element is used to represent longer quotations that are typically styled to stand out from the surrounding text. On the other hand, the <q>
element is used for shorter inline quotations that are within a paragraph.
There are two types of Quotation Elements use in HTML:
Types:
1. <blockquote>
Definition:
The <blockquote>
element is used to represent a longer quotation. It usually renders with indentation and sometimes visual styles to indicate that it’s a separate block of quoted text.
Syntax:
<blockquote>
Quoted text goes here.
</blockquote>
Example:
HTML
<!DOCTYPE html>
<html>
<body>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Enim fugit, minus, et impedit esse optio amet itaque doloribus vero voluptate similique veniam labore architecto saepe dolore at harum earum voluptatum!</p>
<blockquote>
<p>Success is not final, failure is not fatal: It is the courage to continue
that counts.</p>
<footer>- Winston Churchill</footer>
</blockquote>
</body>
</html>
Output:
2. <
q>
Definition:
The <q>
element is used for inline quotations within a paragraph. Browsers often automatically add quotation marks around the text enclosed by <q>
.
Syntax:
<p>This is a <q>short quotation</q> within a paragraph.</p>
Example:
HTML
<!DOCTYPE html>
<html>
<body>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Enim fugit, minus, et impedit esse optio amet itaque doloribus vero voluptate similique veniam labore architecto saepe dolore at harum earum voluptatum!</p>
<blockquote>
<p>Success is not final, failure is not fatal: It is the courage to continue
that counts.</p>
<footer>- Winston Churchill</footer>
</blockquote>
<p>The <q>only way to do great work is to love what you do</q>, - Steve Jobs</p>
</body>
</html>