CSS Tutorial Lesson 4: External Style Sheet

When we wish to create a website with a uniform look, we can apply uniform formatting for all its webpages using an external style sheet. The procedure is to create a stand-alone CSS file and then link all the webpages to this file. In this way, we do not need to create a style for every webpage. If you need to make any changes in style for all the webpages, you just need to edit the external CSS file instead of editing all the webpages, thus saving a great deal of time.
To create a stand-alone CSS file, you can use any text editor such as notepad.
For example,  you can create a style sheet such as this in notepad:
p  { font-size: 14 pt; color: red}
li { color: blue}
ul{ text-decoration: green}
Click save as  and select All file types and save the document as style.css.  (*A CSS file must ends with extension css.)

Now, you can create an html document to link to the above CSS file . To link to the external CSS file, we use the link element together with the attributes href, type and rel. The attribute href is to specify the path of the CSS file, the type attribute is to specify the type of document it is linking to and rel is to specify the relationship between the CSS file and an HTML document. An HTML document can link to more than one external CSS files.

Example 4.1

I have written and published a few books for the past two years, the books are listed below

• Visual Basic 6 Made Easy


• Excel VBA Made Easy


• Visual Basi 2008 Made Easy


• Online Business Made Easy

Save this document as exstyle.htm.

The Output