<cite> marks the title of a creative work, such as a book, film, article, or webpage. It does not mark any text merely because that text is a quotation, and it does not mark an author’s name.
Reference a work
The invented title is marked as a work. The person’s name stays ordinary text.
HTML and CSS
HTML
<p>
Alex Example’s <cite>Garden Notes</cite> is the fictional book used in this
demonstration.
</p>
<p>The advice is <q>Start with one pot.</q></p>
CSS
cite {
font-style: italic;
}
Edit HTML or CSS to update the preview as you type. Copy code snippet copies the selected tab. Preview spacing and font defaults are not included.
Content and appearance
Cite accepts phrasing content and global attributes. Browsers commonly display it in italics; changing font-style does not remove its meaning. Use a within or around the title when readers should visit the source.
The cite attribute on blockquote or q is different: it stores a source URL, usually without displaying it. Neither attribute nor element invents bibliographic information or visible credit.
Choose the right markup
Use <q> for a short quotation, <blockquote> for a quoted passage, and em for stress emphasis. Use CSS for text that is italic only for design. In the example, swapping cite and q would misdescribe the title as a quotation and the advice as a work title.
Sources and browser support
MDN: cite describes the syntax and links to the specification and compatibility data. Check individual values in that table when supporting older browsers.