Which is better, @import or <link>?
I've reviewed these results:
<!-- m --><a class="postlink" href="http://w3development.de/css/hide_css_from_browsers/import/">http://w3development.de/css/hide_css_fr ... rs/import/</a><!-- m -->
However they don't have any effect since I am using tantecs high-pass filter to hide the CSS from incompatable browsers.
That being said, is there any technical advantage of using one vs the other?If you're using multiple stylesheets (a.k.a. styleswitcher) on your website, you would have to use a <link>. If you're using only one, I don't think it really matters.
<style type="text/css" media="screen">
<!--
@import url(css/styles.css);
-->
</style>
I use that.Using @import hides the stylesheet from Netscape 4. Including media= in a link also hides the stylesheet from Netscape 4. A link without a media attribute will be processed by Netscape 4. Other than that there is no real difference between the two methods.Using the @ import method also produces the FOUC (<!-- m --><a class="postlink" href="http://www.bluerobot.com/web/css/fouc.asp">http://www.bluerobot.com/web/css/fouc.asp</a><!-- m -->) effect in IE
I've reviewed these results:
<!-- m --><a class="postlink" href="http://w3development.de/css/hide_css_from_browsers/import/">http://w3development.de/css/hide_css_fr ... rs/import/</a><!-- m -->
However they don't have any effect since I am using tantecs high-pass filter to hide the CSS from incompatable browsers.
That being said, is there any technical advantage of using one vs the other?If you're using multiple stylesheets (a.k.a. styleswitcher) on your website, you would have to use a <link>. If you're using only one, I don't think it really matters.
<style type="text/css" media="screen">
<!--
@import url(css/styles.css);
-->
</style>
I use that.Using @import hides the stylesheet from Netscape 4. Including media= in a link also hides the stylesheet from Netscape 4. A link without a media attribute will be processed by Netscape 4. Other than that there is no real difference between the two methods.Using the @ import method also produces the FOUC (<!-- m --><a class="postlink" href="http://www.bluerobot.com/web/css/fouc.asp">http://www.bluerobot.com/web/css/fouc.asp</a><!-- m -->) effect in IE