Skip to content

Importing a CSS file using @import

New Course Coming Soon:

Get Really Good at Git

Learn how to import CSS files using the @import directive

From any CSS file you can import another CSS file using the @import directive.

Here is how you use it:

@import url(myfile.css)

url() can manage absolute or relative URLs.

One important thing you need to know is that @import directives must be put before any other CSS in the file, or they will be ignored.

You can use media descriptors to only load a CSS file on the specific media:

@import url(myfile.css) all;
@import url(myfile-screen.css) screen;
@import url(myfile-print.css) print;
Are you intimidated by Git? Can’t figure out merge vs rebase? Are you afraid of screwing up something any time you have to do something in Git? Do you rely on ChatGPT or random people’s answer on StackOverflow to fix your problems? Your coworkers are tired of explaining Git to you all the time? Git is something we all need to use, but few of us really master it. I created this course to improve your Git (and GitHub) knowledge at a radical level. A course that helps you feel less frustrated with Git. Launching Summer 2024. Join the waiting list!
→ Get my CSS Handbook
→ Read my CSS Tutorial on The Valley of Code

Here is how can I help you: