@import
The @import CSS at-rule loads styles from another stylesheet.
Overview
The @import CSS at-rule loads styles from another stylesheet.
Browser support
| Feature | Desktop | Mobile | ||||
|---|---|---|---|---|---|---|
| Chrome | Edge | Firefox | Safari | Chrome Android | Safari iOS | |
| 1 | 12 | 1 | 1 | 18 | 1 | |
| DOM API | ||||||
| The CSSImportRule interface represents an @import at-rule. | 1 | 12 | 1 | 1 | 18 | 1 |
| The read-only href property of the CSSImportRule interface returns the URL specified by the @import at-rule. | 1 | 12 | 1 | 1 | 18 | 1 |
| The read-only media property of the CSSImportRule interface returns a MediaList object representing the media query list of the @import rule. | 1 | 12 | 1 | 1 | 18 | 1 |
| The read-only styleSheet property of the CSSImportRule interface returns the CSS Stylesheet specified by the @import at-rule. This will be in the form of a CSSStyleSheet object. | 1 | 12 | 1 | 1 | 18 | 1 |
1+Supported (version) Not supported ※Has note Sub-feature descriptions sourced from MDN Web Docs (CC BY-SA 2.5)
Syntax
CSS
@import url('reset.css');
@import url('theme.css') screen;
@import url('print.css') print;Live demo
Use cases
Using @import
The @import CSS at-rule loads styles from another stylesheet.
Cautions
- May not be supported in older browsers.
Accessibility
- Make sure visual changes are conveyed appropriately to assistive technology.
Related links
Powered by web-features