Why @import is not advisable to link css?

2019-06-14 22:58发布

问题:

Why @import is not advisable to link css? What @import can't do which can be done by <link> and does @import have any incompatibility with browsers?

What in <Link> make it's advisable? And is there any specialty in @import which is useful?

Should we always ,always use <link>?

回答1:

Here's a link to an article that talks about performances and <link> vs @import : don’t use @import ; quoting a small portion of it :

use LINK instead of @import if you want stylesheets to download in parallel resulting in a faster page.

It's not that old (it's from April 2009 -- i.e. less than one year ago), so it should still be mostly true -- and it's written by Steve Souders, whose name is quite well-known when it comes to front-end performances.


On a more subjective point, I quite prefer using several <link> from my main HTML file : this way, I am able to see in only a quick glance what css files are called -- either looking at the template file on the server, or looking at the generated HTML source on the client side.



回答2:

Here's a pretty complete answer on about.com

Segment from article:

The Difference Between @import and <link>

Before deciding which method to use to include your style sheets, you should understand what the two methods were intended to be used for.

<link> - Linking is the first method for including an external style sheet on your Web pages. It is intended to link together your Web page with your style sheet. It is added to the of your HTML document like this:

<link href="styles.css" type="text/css" />

@import - Importing allows you to import one style sheet into another. This is slightly different than the link scenario, because you can import style sheets inside a linked style sheet. But if you include an @import in the head of your HTML document, it is written:

<style type="text/css">@import url("styles.css");</style> From a standards viewpoint, there is no difference between linking to an external style sheet or importing it. Either way is correct, and either way will work equally well (in most cases). But there are a few reasons you might want to use one over the other.

See the article for the rest.