Introduction
The <blockquote> tag
is used for indicating a block of longer quotation (i.e. quotation including multiple lines or paragraphs). In simple terms, it defines a block of quotation that is taken from another source. Mostly the browser indents the text from both left and right with a white space margin (5 spaces) and this tag renders with paragraph breaks. It is used only for long quotations; if you need to use short quotes then you can use <q> tag. You can use multiple <blockquote> tags in your web page. This tag must have a start <blockquote> tag and an end </blockquote> tag. If you don't want to use a blockquote tag, you can use css in place of blockquote tag. See in the following code and output.
Syntax
cite="URL of source information"
class="class name(s)"
dir="ltr | rtl"
id="unique alphanumeric identifier"
lang="language code"
style="style information"
title="advisory text">
</blockquote>
Example
- <blockquote cite="http://www.c-sharpcorner.com/Articles/ArticleListing.aspx?SectionID=1&SubSectionID=244">
In this article, you will learn about the blockquote tag of HTML5 in detail with the Example. <br /> You will see there are many different types of Attributes and Events introduced by HTML5 and Internet Explorer.
</blockquote>
Element - specific Attributes |
Attributes |
Description |
Cite |
The value of this attribute should be a URL for the document in which the information cited can be found. |
|
Attributes Introduced by HTML5
Attributes |
Values |
accesskey |
spaced list of accelerator key(s) |
contenteditable |
true | false | inherit |
contextmenu |
id of menu |
data-X |
user-defined data |
draggable |
true | false | auto |
hidden |
hidden |
itemid |
microdata id in URL format |
itemprop |
microdata value |
itemref |
space-separated list of IDs that may contain microdata |
itemscope |
itemscope |
itemtype |
microdata type in URL format |
spellcheck |
true | false |
tabindex |
number |
Attributes Introduced by Internet Explorer
Attributes |
Values |
accesskey |
key (5.5) |
contenteditable |
false | true | inherit |
disabled |
false | true |
hidefocus |
true | false |
language |
javascript | jscript | vbs | vbscript |
tabindex |
number |
unselectable |
off | on |
HTML5 Event Attributes |
onabort |
onblur |
oncanplay |
oncanplaythrough |
onchange |
onclick |
oncontextmenu |
ondblclick |
ondrag |
ondragend |
ondragenter |
ondragleave |
ondragover |
ondragstart |
ondrop |
ondurationchange |
onemptied |
onended |
onerror |
onfocus |
onformchange |
onforminput |
oninput |
oninvalid |
onkeydown |
onkeypress |
onkeyup |
onload |
onloadeddata |
onloadedmetadata |
onloadstart |
onmousedown |
onmousemove |
onmouseout |
onmouseover |
onmouseup |
onmousewheel |
onpause |
onplay |
onplaying |
onprogress |
onratechange |
onreadystatechange |
onscroll |
onseeked |
onseeking |
onselect |
onshow |
onstalled |
onsubmit |
onsuspend |
ontimeupdate |
onvolumechange |
onwaiting |
|
|
Events Defined by Internet Explorer |
onactivate |
onbeforeactivate |
onbeforecopy |
onbeforecut |
onbeforedeactivate |
onbeforeeditfocus |
onbeforepaste |
onblur |
onclick |
oncontextmenu |
oncontrolselect |
oncopy |
oncut |
ondblclick |
ondeactivate |
ondrag |
ondragend |
ondragenter |
ondragleave |
ondragover |
ondragstart |
ondrop |
onfocus |
onfocusin |
onfocusout |
onhelp |
onkeydown |
onkeypress |
onkeyup |
onlosecapture |
onmousedown |
onmouseenter |
onmouseleave |
onmousemove |
onmouseup |
onmousewheel |
onmouseout |
onmouseover |
onmove |
onmoveend |
onmovestart |
onpaste |
onpropertychange |
onreadystatechange |
onresize |
onresizeend |
onresizestart |
onselectstart |
ontimeerror |
|
|
|
Code :
- <!DOCTYPE html>
- <html>
- <head>
- <title>Blockquote tag in HTML5</title>
- </head>
- <body>
- <p>Working with blockquote tag</p>
- <blockquote cite="http://www.c-sharpcorner.com/Articles/ArticleListing.aspx?SectionID=1&SubSectionID=244">
-
- In this article, you will learn about the blockquote tag of HTML5 in detail with the Example.
- <br /> You will see there are many different types of Attributes and Events introduced by HTML5 and Internet Explorer.
- </blockquote>
- <p> It will help you many ways. It is different from <q> tag</p>
- <q>
- In this line, you will see the difference between the blockquote tag and the q tag.
- </q>
- <p style="margin : 0 40px 0 40px;">
- This paragraph has been indented 40 px on the right side and 40 px on the left side.
- </p>
- </body>
- </html>
Output
Internet Explorer
Chrome
FireFox
Safari