Can I Embed One CSS File into Another?

CSS File Inclusion: Embedding One File into Another

Can you incorporate the contents of one CSS file into another?

The answer is a resounding "Yes." CSS offers an elegant way to achieve this using the @import rule.

To include a CSS file, simply write the following directive as the first line of your CSS file, before any other rules (except for the @charset rule):

@import url("base.css");

This directive instructs the browser to load the specified CSS file (in this case, "base.css") and apply its styles to the current document.

Important Notes:

1. Order matters: The @import rule must appear as the first line of the CSS file, except for the @charset rule. Any other rules before @import will be ignored.
2. HTTP requests: Each @import statement triggers an additional server request. This can introduce performance issues if you have multiple @import statements. A better practice is to concatenate all CSS files into a single file, reducing HTTP requests and improving page load time.

The above is the detailed content of Can I Embed One CSS File into Another?. For more information, please follow other related articles on the PHP Chinese website!