码农教程 - 一技在手,衣食无忧! tools

HTML <q> Tag

❮ Previous Complete HTML Reference Next ❯

Example

Mark up a short quotation:

<p>WWF's goal is to:
<q>Build a future where people live in harmony with nature.</q>
We hope they succeed.</p>
Try it Yourself »

More "Try it Yourself" examples below.

Definition and Usage

The <q> tag defines a short quotation.

Browsers normally insert quotation marks around the quotation.

Tip: Use <blockquote> for long quotations. 

Browser Support

Element
<q> Yes Yes Yes Yes Yes

Attributes

Attribute Value Description
cite URL Specifies the source URL of the quote

Global Attributes

The <q> tag also supports the Global Attributes in HTML.

Event Attributes

The <q> tag also supports the Event Attributes in HTML.

More Examples

Example

Use CSS to style the <q> element:

<html>
<head>
<style>
q {
  color: gray;
  font-style: italic;
}
</style>
</head>
<body>

<p>WWF's goal is to:
<q>Build a future where people live in harmony with nature.</q>
We hope they succeed.</p>

</body>
</html>
Try it Yourself »

Related Pages

HTML DOM reference: Quote Object

Default CSS Settings

Most browsers will display the <q> element with the following default values:

Example

q {
  display: inline;
}

q:before {
  content: open-quote;
}

q:after {
  content: close-quote;
}
Try it Yourself »


❮ Previous Complete HTML Reference Next ❯