HTML Quotation
HTML Quotation
This is the lesson 4 of 10 in the course HTML - Beginner to Advance

Hy Guys, In this chapter we will learn about the HTML Quotation element. The Quotation elements in HTML are used to insert quoted texts in the website or a web page. Quotation creates a difference from the normal HTML elements text on the web page.

Table of Contents

HTML Quotations

Some of the most used Quotation elements of HTML:

<q><blockquote><address><bdo>
<abbr><cite>

Here we will discuss six HTML Quotation elements in this chapter. Let’s Start!

HTML <q> Element:

<q> element is used for short quotation, Browser usually inserts double inverted comma before and after the specified text.

Click on the play button and preview the code. You can edit the code!

<!DOCTYPE html>
<html>
<body>
<p>As we know, just like Indian tourism has the tagline <q>Incredible India!</q> along with the slogan <q>Atithi Devo Bhava</q>, states have the freedom to pick their own taglines and slogans.</p>
</body>
</html>

HTML <blockquote> Element:

The <blockquote> element is also used for quotations in a different way. It is used to represent those quotes that have been picked from another source. It does not quote the text in a double inverted comma. Browser usually indent <blockquote> elements.

<!DOCTYPE html>
<html>
<body>

<p>India</p>

<blockquote cite="https://www.travelholicq.com/indian-states-with-their-tourism-taglines/">
As we know, just like Indian tourism has the tagline <q>Incredible India!</q> along with the slogan <q>Atithi Devo Bhava</q>, states have the freedom to pick their own taglines and slogans.
</blockquote>

</body>
</html>

Preview the code you will see the difference!

HTML <address> Element:

The <address> tag defines the contact information for the author or owner. The browser parses the address content and displays it in italic format.

<!DOCTYPE html>
<html>
<body>

<address>
Code Designer World<br> 
Visit us at:<br>
www.rareprogrammer.com<br>
Rajasthan,<br>
India<br>
Pin 123456<br>
</address>

</body>
</html>

HTML <bdo> Element:

BDO stands for Bi-Directional Override. The <bdo> element can reverse the letters of selected text content from right to left. For reverse text, we need to use the dir attribute inside the <bdo> tag. It works like a mirror.

<!DOCTYPE html>
<html>
<body>

<bdo dir="rtl">Code Designer World</bdo>

</body>
</html>

HTML <abbr> Element:

The <abbr> element is used to define a text as an acronym or abbreviation. The title attribute can be used to show the form of abbreviation text.
Marking abbreviations can give useful information to browsers, translation systems, and search engines.

<!DOCTYPE html>
<html>
<body>

<p>The earliest successful <abbr title="Artificial Intelligence" >AI</abbr> program was written in 1951 by Christopher Strachey, later director of the Programming Research Group at the University of Oxford.</p>

</body>
</html>

HTML <cite> Element:

The <cite> element is used to define a title of a work. The text in the <cite> element is usually rendered in italic.

<!DOCTYPE html>
<html>
<body>


<img src="https://5.imimg.com/data5/GJ/CB/IW/ANDROID-87605443/1594320741287-jpg-500x500.jpg" width="200" height="257" alt="Rich Dad Poor Dad">
<p><cite>Rich Dad Poor Dad</cite> is a 1997 book written by Robert Kiyosaki and Sharon Lechter.</p>

</body>
</html>

Question of the day:

Create a letter using HTML Quotation?

Hope you enjoyed this chapter. Increase the area of thinking, you can create anything!

You can practice with our Instagram posts.

Thank You for reading!

Course Navigation<< HTML Style | CSS Style in HTMLHTML Formatting >>
Click to rate this post!
[Total: 0 Average: 0]

Oh, hi there πŸ‘‹ It’s nice to meet you.

Sign up to receive awesome content in your inbox, every week.

We don’t spam! Read our privacy policy for more info.

Leave a Reply