Link

stylesheet

Fetches a CSS style sheet and applies it to the document.

Code examples

Good example
<link rel="stylesheet" href="/styles.css">
Loads and applies the site style sheet.
Good example
<link rel="stylesheet" href="/print.css" media="print">
Applies this style sheet when the document is printed or previewed for print.
Avoid this example
<link rel="stylesheet">
Has no href, so there is no style sheet to fetch or apply.

Recommendations

  • 01
    Use media for conditional styles
    Set media when a sheet applies only in conditions such as print. The browser can still fetch it, but may give it a different priority.
  • 02
    Link CSS directly
    A stylesheet link lets the browser discover CSS from HTML. CSS @import rules are found only after the containing sheet has arrived and been parsed.
  • 03
    Avoid preload duplication
    A stylesheet link already fetches its CSS. If you also preload the file, make sure the URL, destination, and CORS mode match exactly.

Related documentation