A Short Introduction to Style Sheets

In a nutshell, style sheets are a new, standardized technology for adding sophisticated page layout and style to your web pages. Forget the old HTML limitations, style sheets give you

Style sheets also provide a powerful way of adding style to whole sites, and modifying the style of whole sites quickly, without having to even touch the HTML files involved.

If you would like to know more, we have a comprehensive tutorial about style sheets at our web site.

If you downloaded the application, then the tutorial should be already on your hard disk. Click here to open it.

If this link doesn't work, you can download the tutorial from http://www.westciv.com.au/style_master/academy/index.html.

How do style sheets actually work?

A Style Sheet is simply a set of instructions, called Statements which inform your browser how to display different elements on a web page.

You can think of a style sheet as a program, instructing a browser how to draw web pages. CSS, the language of style sheets, is, in a way a programming language for telling browsers how to draw web pages.

A simple example is the following statement:

H1 { color: red}

This tells the browser to draw all Headings of level 1 in a page in red.

Each statement has two parts, a Selector and a Declaration.

Let's take a look at the following statement

P { background-color: black;
color: white}

This statement has a selector P which identifies any Paragraph element (<P> in HTML) in a page

It also has a declaration with two properties, which set the background color to black, and the color of the text to white respectively.

When a browser sees this statement, it understands it as follows:

Any <P> elements should be drawn with a black background, while the text in these elements should be white.

Next

Next we take a brief look at Style Master, and learn about the overall process of working with style sheets.

welcome about style sheets about style master creating style sheets selectors properties previewing linking