CSS Link or Import

Question

Is it best to use Link or Import for an external css file (or
both)?
Brandon
==================
Presentations Direct -
http://www.presentationsdirect.com
> Binding Machines
http://www.presentationsdirect.com/binding-machines/gbc-binding-machines.asp
> Laminators
http://www.presentationsdirect.com/laminators/gbc-laminators.asp
> Paper Shredders
http://www.presentationsdirect.com/paper-shredders/gbc-paper-shredders.asp
==================

Answer 1

> So Link works for all major browsers today?
Always has. It's a HTML tag and works for more than just
stylesheets.
@import is a style rule (needs to be wrapped in
<style>...</style> tags in
HTML pages) and is the new kid on the block.
Importing stylesheets has advantages over merely LINKing
style sheets to a
HTML documents, including breaking your stylesheets into
modules for easy
maintenance.
To use importing, you can use it directly in an HTML
<style> tag, but then
you might as well use link because import would be doing the
same thing:
including that stylesheet in the HTML page.
To really take advantage of importing, you should import
other stylesheets
into a master stylesheet that is linked to the HTML page.
First link one stylesheet to the HTML page:
<link type="text/css" rel="stylesheet" href="css/main.css"
/>
And then import the other stylesheets into the master one.
Only the master
css file is linked to the HTML page.
So in this example, import the other stylesheets into
main.css:
/* Import the other stylesheets into main.css */
@import url("styles.css");
@import url("layout.css");
The main advantage of importing stylesheets is that updating
stylesheet
links is easier, because you update them in a single CSS file
that is
imported rather than in every HTML page.
Consider:
<link type="text/css" rel="stylesheet" href="css/main.css"
/>
<link type="text/css" rel="stylesheet" href="css/docs.css"
/>
Then, main.css contains:
/* Import the other stylesheets into main.css */
@import url("styles.css");
@import url("layout.css");
/* Now define some additional styles */
div.main-banner {border:none;width:600px;}
div.newsscroller {background-color:black;}
See
http://dhtmldev.com/content/view/63/27/
for more.
Regards
John Waller