HEYGB.COM

A Short Look Again

In previous tutorial you learned how to use an external style sheet. You simply include one line of code on your pages to affect the entire page with the style specified in that external style sheet. Did you remember the code how to do that, if not have a look:

<LINK REL="stylesheet" TYPE="text/css" HREF="mysite.css">

And in this tutorial I will show you how to embed a style sheet directly into your web page. It will also show you how to define custom styles, styles which are not associated with any particular HTML tags.

There are four ways a style can be applied to a web page:

1. Styles are specified through the use of an external file, a method called “external style sheet” or “linked style sheet.” There is one file on your site that specifies the styles. Then, one line in each of your web pages links to that file. To change the style on all your web pages, simply change the external file. This is the method you learned in the first tutorial http://www.heygb.com/css-tutorials/learn-css-from-scratch-cascading-style-sheets-part-i in this series.

2. Styles are specified in the HEAD area of each page the style is applied to. This method is called “embedded style sheet” and is the method you’ll learn in this tutorial.

3. A style is specified in the actual HTML tag where the style is applied. This is called an “inline style.” This will be addresses in a future tutorial.

4. A combination of embedded and external style sheets. For this, each page has an embedded style sheet. Within the embedded style sheet are certain codes that import one or more external style sheets. This method is called “imported style sheet.” This will be addresses in a future tutorial.