CSS Rules

CSS RULES

Cascading Style Sheets are a set of rules that govern the display of the document through a web browser. The rules simply are lines of command codes that tell the browser how to display the information. It is crucial with CSS to get the syntax of the command lines correct to keep any frustrating errors from popping up.

What does a rule look like?

The SELECTOR selects (determines) which HTML element you’re working with. HTML elements are common tags like <body>, <H1>, <p>. Often the selector is referred to as an element selector or a type selector.

The DECLARATION tells the browser what to do with the Selected element. It consists of two parts:

The PROPERTY, which identifies which attribute like font type, size and color, for example, is called into play.

The VALUE, determines how the attribute works, in other words it causes the action that changes the font type, size and color to what the property asks for.

A declaration is always signaled by a { bracket and is ended with a closing }.

A property is separated by a : and a ; ends each declaration.

An example of a Declaration:

Why does the code look like this? Browser can read the code in single lines or in staggered lines like the example above. The reason for the staggered line is so our eyes can more easily catch silly errors that can end up costing valuable programming time.

Ok, so you're thinking that you could get the same result by just tagging <H1> each with <font color="blue" face="arial">. You could, but what if you have a 20 page site and you want to change the from blue to orange. With one simple change you can change the entire site, and quickly change it back if you hate the new look. That's the beauty of CSS.

Set as favorite

Bookmark

Email This

Comments (0) Add Comment