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