CSS import Rule Import Style Sheet Tutorial
Learn to use the CSS @import rule. The import rule is used to import style sheets into other style sheets and any documents where @import can be applied.
index.html
<link rel="stylesheet" href="example_a.css">
<h1>Hello World</h1>
example_a.css
@import url("example_b.css");
body { background: pink; }
example_b.css
h1 { color: red; font-size: 50px; }
This example shows how the @import rule can be made @media dependent for responsive layout logic.
@import url("example_b.css") handheld and (max-width: 400px);
This example shows how to import style sheets into index.html directly.
<style>
@import url("example_a.css");
@import url("example_b.css");
</style>
<h1>Hello World</h1>