The
<q>tag is used to define a short inline quotation.
Browsers usually display the quoted text with quotation marks automatically.
It is an inline element and suitable for single sentences or short phrases.
Syntax
<q cite="source-url">Short quoted text</q>Attributes
| Attribute | Description |
|---|---|
cite | URL of the source of the quotation. |
class | Assigns one or more class names for styling. |
id | Assigns a unique identifier to the element. |
style | Adds inline CSS styles to customize appearance. |
title | Provides additional information as a tooltip. |
Example
<!DOCTYPE html>
<html>
<head>
<title>Q Tag Example</title>
<style>
.inline-quote {
color: #2c3e50;
font-style: italic;
}
</style>
</head>
<body>
<h1>HTML <q> Tag Example</h1>
<p>
Albert Einstein once said: <q class="inline-quote" cite="https://www.example.com" title="Einstein Quote">Imagination is more important than knowledge.</q>
</p>
</body>
</html>Output
Browser Output
Use our TryIt Editor to see the output.
Browser Support
 Chrome |  Firefox |  Edge |  Safari |  Opera |  IE9+ |
|---|---|---|---|---|---|
| ✅Yes | ✅Yes | ✅Yes | ✅Yes | ✅Yes | ✅Yes |
The text appears inline with quotation marks around it. The cite and title attributes are not directly visible.
Notes
<q>is an inline element and does not break the line.- The
citeattribute provides semantic reference for the source. It visually can’t be seen. - CSS can style the quotation (color, font-style, spacing).
- Ideal for short quotes inside a paragraph.
Conclusion
The <q> tag is used for short inline quotations.
It automatically adds quotation marks around the text and supports semantic source referencing.
