Menu

HTML blockquote Tag

HTML blockquote Tag

For displaying any quote on a webpage, HTML provides the <blockquote> tag. The text enclosed within the <blockquote> tag is displayed in a separate paragraph with a slight change in the indentation of the text towards the right.

  • HTML <blockquote> tag places white spaces both before and after the quotation, and as the name suggests, it's mostly used for showing quotations on a webpage along with the author's name.
  • This is a block-level element.

HTML <blockquote> Tag - Syntax and Usage

The <blockquote> tag requires the start(opening) tag and end(closing) tag.

The required syntax for the same is given below:

<blockquote>
    Your quote comes here...
</blockquote>

HTML <blockquote> Tag Basic Example

Below we have a basic example to understand how we can use the of <blockquote> tag:

<!doctype html>
<html>
    <head>
        <title>
            Example for blockquote tag
        </title>
    </head>
    <body>
        <h2>Studytonight.com</h2>
        <p>Studytonight is the best place to learn coding online.</p>
        <p>We provide simple, easy to understand and detailed tutorials for various programming languages like Python, Java, HTMl, CSS.</p>
        <p>Here is a quote by our founder:</p>
        <blockquote>
            <p>There is no distance you can't cover, just keep walking.</p>
            - <cite>Abhishek Ahlawat</cite>
        </blockquote>
        
    </body>
</html>

HTML <blockquote> Tag Attributes

This element does not have any specific attributes although this element supports Global attributes and Event attributes.

In the <blockquote> tag, we can use the <cite> tag to provide the name of the author or the source of the quotation. In the code example shown above, we have used the <cite> tag too.

Default CSS Style For HTML <blockquote> tag

Following is the default CSS style rule applied on the <blockquote> tag by default:

blockquote {
    display: block;
    margin-top: 1em;
    margin-bottom: 1em;
    margin-left: 40px;
    margin-right: 40px;
}

Browser Support for HTML <blockquote> tag

Following browsers support this attribute:

  • Firefox 1+
  • Google Chrome 1+
  • Internet Explorer 2+
  • Apple Safari 1+
  • Opera 2.1+