hypergurl logo

Cascading Stylesheets Tutorial #3
Importing a Cascading Stylesheet
Importing an External Stylesheet

Google
Web Search Hypergurl.com



Handy Tip: Be careful what you name your CLASS and ID selectors. If you start them with a number, they won't work in Netscape browser.


Bookmark This Page

CSS Tutorial #3

Importing a Cascading Stylesheet.


Importing an external stylesheet works much the same as linking.

Firstly make your text .css file. Call it "yourfile.css" and include these styles;

H1 { color: yellow; font-family: times }
P { background: silver; font-family: arial}


(This will make all text on your page within H1 tags times, color yellow and all text within P tags arial with a background of silver.)

You can over-ride the H1 tag and still retain the command for the P tag just by adding a style in the command line like below.

<head>
<title>Stylesheet tutorial</title>
<STYLE TYPE="text/css">
<!--
@import url (yourfile.css);
H1 { color: blue; font-family: garamond; }
-->
</STYLE>
</head>
<body>
<H1>This is an example of CSS</H1>
<P>It's easy!</P>
</body>


Your browser first imports the "yourfile.css" rules and then adds the embedded rules to it.

H1 has a rule both in the external stylesheets file and in the embedded styles. The browser applies the rules of Cascading order of importance which are;

Inline styles
Embedded styles
Linked styles
Imported styles
Default browser styles

You must always place the @import line first, before adding any embed styles.

You can import as many stylesheets files as you want and override them with embedded styles as desired. Unfortunately, only IE 4 and 5+ support importing.

Next CSS Tutorial; Working with Fonts


 

 
Hypergurl Hosting
IMPROVED PLANS
FREE Domain Name
web hosting and domain registration

 
Hosting Log In
Username:
Password: Sign up
NEW!
Blog for Webmasters


web site design feed Website Design

 
Refer A Friend
Your Email
Your Name
Friends Email
Friends Name


Home
Site Map
Email Hypergurl
About
Link To Hypergurl

Site design copyright 2001-2008 © hypergurl.com