Handy
Tip: Internet Explorer is more forgiving than Netscape
when it comes to CSS syntax errors. Therefore, it is important
to check your website design in both browsers to ensure it looks
how you intend.
|
 Bookmark
This Page
Cascading stylesheets tutorial
#2.
Linking to stylesheet.
Last page you learned how to embed stylesheets code into the head of your
document, one page at a time, but if you want to change many pages at
once it is very time consuming.
If you have a large site it is easier to link to one stylesheet that holds
all the information for all your webpages.
Linking to stylesheets is pointing multiple HTML documents to one central
stylesheets document. This external file will set the rules for all of
your web pages. If you make a change such as the font size in the stylesheets
file, all of your pages will instantly reflect that change.
Instead of using the style tag
to define the stylesheet function within the head of your html document,
you use the link tag within the head like below:
<html>
<head>
<title>your
page</title>
<LINK REL=stylesheet HREF="yourfile.css"
TYPE="text/css">
</head>
<body>
<H4><b>Cascading
StyleSheets Tutorial</b></H4>
<b>Introduction to Cascading
Stylesheets!</b>
<P>This is just <b>an example</b>
of the many <b>cool</b> things you
can do with the use
of CSS</P>
</body>
</html>
Now create a separate
text file in Windows Notepad, called "yourfile.css"
(or whatever
you like) and place all the css styles you want to use. From the above example,
this text file would only contain;
H4, b {color: 63639C; font-family:
arial}
P {text-indent: 3cm; background: silver; font-family: courier}
Of course you can add whatever styles you are applying to your html document
within the text file and use it on as many html pages that you want. Simply
upload the file to your server, as you would any other file and when you wish
to change a font property or color you simply go to that text file, make the change,
re-upload the file and every page on your site with the style link within the
head, will be changed.
Now you can make a change on many pages quickly
and simply.
On to next tutorial Importing
a Stylesheet
|
|
Website
Design
|
