TheDeveloperBlog.com

Home | Contact Us

C-Sharp | Java | Python | Swift | GO | WPF | Ruby | Scala | F# | JavaScript | SQL | PHP | Angular | HTML

HTML blockquote tag

HTML blockquote tag with examples, html5, forms, input, text, anchor, image, heading, marquee, textarea, paragraph, title, quotes, code etc.

<< Back to HTML

HTML <blockquote> tag

HTML <blockquote> tag is used to define a block of text which is quoted from another source. The Browser usually displays the content within <blockquote> tag as indented text.

If you want to insert a long quote then use <blockquote> and for short or inline quote use <q> tag.

Syntax

<blockquote> quoted text......</blockquote>

Following are some specifications about the <blockquote> tag

Display Block
Start tag/End tag Both start and End tag
Usage Semantic/textual

Example

<!DOCTYPE html>
<html>
<head>
	<title>Blockquote tag</title>
</head>
<body>
	<h2>Example of blockquote tag</h2>
	<p>A Great Motivational Quote :</p>
   <blockquote cite="https://www.brainyquote.com/authors/erin_cummings">
   	<p>
	 At the end of the day, you are solely responsible for your success and your failure. And the sooner you realize that, you accept that, and integrate that into your work ethic, you will start being successful. As long as you blame others for the reason you aren't where you want to be, you will always be a failure.
	 </p>
   </blockquote>
<cite>Erin Cummings</cite>
</body>
</html>
Test it Now

Output:

HTML blockquote tag

Styling <blockquote> tag

<!DOCTYPE html>
<html>
<head>
	<title>Blockquote tag</title>
   <style>
   	blockquote{
   		text-align: justify;
   		background-color: #F7EAE9;
                           border-radius: 4px;
                           margin-right: 25px;}
   	cite{
   	  margin-left: 15px;}
   </style>
</head>
<body>
	<h2>Example of blockquote tag</h2>
	<p>A Great Motivational Quote:</p>
   <blockquote cite="https://www.brainyquote.com/authors/erin_cummings">
   	<p>
	 At the end of the day, you are solely responsible for your success and your failure. And the sooner you realize that, you accept that, and integrate that into your work ethic, you will start being successful. As long as you blame others for the reason you aren't where you want to be, you will always be a failure.
	 </p>
   </blockquote>
<cite>-Erin Cummings</cite>
</body>
</html>
Test it Now

Note: We have used CSS property margin-right: 25px to change the indentation applied to the text. You can also use margin-left or margin shorthand property.

Output:

HTML blockquote tag

Attribute

Tag specific attribute

Attribute value Description
citeHTML blockquote tag URL It is used to specify the URL of the source from where the quote is taken.

Global attributes

The <blockquote> tag supports all the global attributes in HTML.

Event attributes

The <blockquote> tag supports all events attributes in HTML.

Supporting Browsers

Elementchrome browser Chromeie browser IEfirefox browser Firefoxopera browser Operasafari browser Safari
<blockquote>YesYesYesYesYes
Next TopicHTML body Tag




Related Links:


Related Links

Adjectives Ado Ai Android Angular Antonyms Apache Articles Asp Autocad Automata Aws Azure Basic Binary Bitcoin Blockchain C Cassandra Change Coa Computer Control Cpp Create Creating C-Sharp Cyber Daa Data Dbms Deletion Devops Difference Discrete Es6 Ethical Examples Features Firebase Flutter Fs Git Go Hbase History Hive Hiveql How Html Idioms Insertion Installing Ios Java Joomla Js Kafka Kali Laravel Logical Machine Matlab Matrix Mongodb Mysql One Opencv Oracle Ordering Os Pandas Php Pig Pl Postgresql Powershell Prepositions Program Python React Ruby Scala Selecting Selenium Sentence Seo Sharepoint Software Spellings Spotting Spring Sql Sqlite Sqoop Svn Swift Synonyms Talend Testng Types Uml Unity Vbnet Verbal Webdriver What Wpf