The CSS @import Rule

(Largely from https://www.w3schools.com/)

The @import rule allows you to import a style sheet into another style sheet.

The @import rule must be at the top of the document (but after any @charset declaration).

The @import rule also supports media queries, so you can allow the import to be media-dependent.

Import a style sheet titled navigation.css into the current style sheet lile this:

@import "navigation.css"; /* Using a string */

or

@import url("navigation.css"); /* Using a url */

CSS Syntax

@import url|string list-of-mediaqueries;

Example

Import the "printstyle.css" style sheet ONLY if the media is print:

@import "printstyle.css" print;

Example

Import the "mobstyle.css" style sheet ONLY if the media is screen and the viewport is maximum 768 pixels:

@import "mobstyle.css" screen and (max-width: 768px);