Definition and Usage
<cite> tag represents the title of a creative work—like a book, musical, court case, exhibition, or software—and is typically used when referencing such works.
This can be a work that is being quoted or referenced in detail (i.e., a citation), or it can just be a work that is mentioned in passing.
Most browsers display the text inside the <cite> tag using an italic font-style by default.
According to the HTML specification, the <cite> tag should be used as follows:
- It represents the title of a cited work, which can be a variety of types including books, films, web pages, scholarly articles, or music.
- Text within the
<cite>tag is generally rendered in italic font style, indicating the title or source of the cited work. - The
<cite>tag should contain only the title of the work being cited; other details should not be included inside the tag.
Important!
A person's name is not a title of a work (even if people colloquially refer to that person as a work),
so the <cite> tag should never be used to mark people’s names.
Differences Between the <cite> and <q> Tags
Both the <cite> and <q> tags are used to represent citations, but their purposes and meanings are completely different. Here, we explain the differences between these often-confused tags with practical examples.
The <cite> tag represents the title of a cited work or the work itself, while the <q> tag is used to represent a short piece of quoted text from another source.
| Tag | Purpose | Common Usage Examples |
|---|---|---|
<cite> |
Indicates the title or source of a cited work | Book titles, movie names, song titles, etc. |
<q> |
Represents short inline quotations | Quoting speech in conversations, brief excerpts in articles, etc. |
The <cite> Tag
The <cite> tag represents the title or source of a cited work. It is primarily used to emphasize or identify the name or title of a document or creative work. The main purpose of the <cite> tag is to indicate the source of a citation, and it is usually rendered in italics.
The <q> Tag
Correct Usage of <cite> and <q> Tags
Next, let's review examples and explanations based on the specification regarding the correct and incorrect use of the <cite> tag.
The example above shows incorrect usage. The <cite> tag is meant to represent the title or source of a cited work and should not be used like a quotation. Use the <q> tag for quotations as in the example below.
This example shows the correct usage. The <q> tag represents a short quotation, and the <cite> tag is not used here.
This example is also incorrect. The <cite> tag is used to represent the title or source of a work and should not be used for entities such as personal names.
Another example of correct usage:
In this example, the <cite> tag is used to represent the title "The Universal Declaration of Human Rights." The text inside the <cite> tag represents the cited work's title.
he text that follows provides additional information about the work. "United Nations" indicates the organization associated with the work, "December 1948" indicates the date of adoption, and "Adopted in General Assembly Resolution 217 A (III)" explains how the work was approved.
The <cite> tag represents the title of a cited work, and any additional information related to the work follows the tag as normal text.
Browser compatibility
| Tag |
Desktop Chrome
|
DesktopDesktop Edge
|
Desktop Firefox
|
Safari
|
|---|---|---|---|---|
<cite>
|
1 | 12 | 1 | 4 |
Specifications
| Specification | |
|---|---|
<cite>
|
HTML Standard #the-cite-element |