cite Tag in HTML

Learn via video course
FREE
View all courses
JavaScript Course With Certification: Unlocking the Power of JavaScript
JavaScript Course With Certification: Unlocking the Power of JavaScript
by Mrinal Bhattacharya
1000
4.8
Start Learning
JavaScript Course With Certification: Unlocking the Power of JavaScript
JavaScript Course With Certification: Unlocking the Power of JavaScript
by Mrinal Bhattacharya
1000
4.8
Start Learning
Topics Covered

Overview

The <cite> tag in HTML is used to define the title of a creative thing such as a book, movie, literature, painting, research paper, books, songs, etc. The content written between the opening and closing cite tag in HTML is rendered as italics text.

To review the basics of HTML Tags, click here.

Syntax

Example

Output:

Syntax of cite Tag

Attributes

The cite tag in HTML supports the global attributes and event attributes.

How to use <cite> Tag in HTML?

The cite tag in HTML is used to cite the title of the creative work like the following:

  • A play or film script
  • A film
  • A television show
  • A book
  • A research paper
  • An essay
  • A poem
  • A song
  • A game
  • A painting
  • A play
  • A song/music
  • A website
  • A web page
  • A blog post or comment
  • A forum post or comment
  • A tweet

The content is written between the opening and closing tags in HTML and renders the content in italics by default. The <cite> tag in HTML 4.1 defines the citation and in HTML5 defines the title of the work.

Note: It’s important to note that the W3C specification says that the title of a creative written within the cite tag may include the author’s name. However, the WHATWG specifications say that the author's name must not be included within the cite tag.

More Examples

Define the title of work with the <cite> tag

Output: Defining the title of work with cite tag

Example to apply the CSS font-style property to the <cite> element

Generally, the browser styles the content of the cite tag in italics by default, but to avoid this we can use the CSS font-style property.

CSS

Adding this code in the CSS will show the content between the cite tag in normal text instead of italics.

Now, if we use the cite tag:

HTML

Output: Applying to CSS font-style property

Accessibility Concerns

There are some accessibility concerns related to the cite tag in HTML, we should try to not use the <cite> tag just to make the text italics. Also, It is generally suggested not to use the author's name within the <cite> element.

Browser support

The list of browsers that support the cite tag in HTML is listed below:

  • Chrome
  • Edge
  • Firefox
  • IE
  • Safari
  • Opera
  • Webview android

Conclusion

  • The cite tag in HTML is used to define the title of creative work.
  • The content is written within the <cite> tag, i.e between the opening(<cite>) and closing(</cite>) cite tag.
  • Syntax: <cite> sample text </cite>
  • Generally, it is suggested to not include the author's name within the cite tag.
  • The text in the <cite> element usually renders in italic but can be changed using CSS.
  • <blockquote>
  • <q>
  • <caption>
  • <colgroup>