HTML - <q> Tag



HTML <q> tag is used to define short quotations. It indicates that the enclosed text is a short inline quotation, browser by default put quation marks around quations. This tag is intended for short quotations that don’t require a paragraph break.

Syntax

<q>.....</q>

Attribute

HTML q tag supports Global and Event attributes of HTML. A specific attribute as well which is listed bellow.

HTML q Tag Attributes

Attribute Value Description
cite URL Hold a an URL that specify the quote source.

Examples of HTML q Tag

In the following examples we will see the use cases, where and how to use the HTML q tag to quote any short text.

Specifying a short Quote

In the following example, let’s see the usage of <q> tag in the HTML document.

<!DOCTYPE html>
<html>
<body>
   <p>
      When Dave asks HAL to open the pod bay door, 
      HAL answers: <q cite="https://www.imdb.com/title/tt0062622/quotes/qt0396921">I'm sorry, Dave. 
      I'm afraid I can't do that. 
   </q>
   </p>
</body>
</html>

Styling the short Quote

Considering the following example, we are using the <q> tag and also styling the content of the q tag using the CSS properties.

<!DOCTYPE html>
<html>
<head>
   <style>
      q {
         color: green;
         font-style: italic;
      }

      p {
         color: green;
         font-size: 30px;
      }
   </style>
</head>
<body>
   <h1>HTML q Tag</h1>
   <p>
      tutorialspoint: <q>Easy to learn!
   </q>
   </p>
</body>
</html>

Specifying cite of the Quoted Text

Let's look at the following example, where we are demonstrating the <q> tag with its attribute and also using the CSS properties to style the content of the <q> tag.

<!DOCTYPE html>
<html>
<head>
   <style>
      q {
         color: green;
         font-style: italic;
      }
   </style>
</head>
<body>
   <h1>The q tag</h1>
   <p>
      <q cite="https://www.tutorialspoint.com">tutorialspoint: Easy to learn!</q>
      A EdTech organization which provides the 
      6000+ course and CSE tutorials and courses!
   </p>
</body>
</html>
For the long quotations use the <blockquote> tag.

Supported Browsers

Tag Chrome Edge Firefox Safari Opera
q Yes Yes Yes Yes Yes
html_tags_reference.htm
Advertisements