Menu
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>?
369
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.
Linking is the first method for including an external style sheet on your web pages. It is intended to link your page with your style sheet. It is added to the head of your HTML document. Importing allows you to import one style sheet into another.
The @import CSS at-rule is used to import style rules from other stylesheets.
A style sheet that is imported into another one has a lower ranking in the cascading order: the importing style sheet overrides the imported one. Programmers may recognize this as the same model as in Java, Modula, Object-Pascal, Oberon and other modular programming languages.
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
LINKinstead of@importif 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.
76
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
