When using basic HTML, it is necessary to use lots of tags in the HTML code in order to implement markup for a specific element - for example, if you want all your H2 elements in your webpage to have green text. In the aforementioned HTML code you would define this as follows:
<h2><FONT color="green">Green text</FONT></h2>
When using CSS, the method is quite different. The above HTML code would become:
<h2>Green text</h2>
and the syle associated with it would be: h2 {color: green;}
This is what is known as a 'rule' and this particular rule will ensure that all occurrences of h2 elements in the webpage would be in the colour green.
You can specify multiple tag names by separating them with a comma (','). So for example, the following h rules:
h1 { background-color: #ffffff }
h2 { background-color: #ffffff }
h3 { background-color: #ffffff }
could also be expressed as: h1, h2, h3 { background-color: #ffffff }
This is usually referred to as grouping.
Tag names are not case sensitive in HTML, so H1 is the same as h1. However, XHTML which is a stricter syntax (HTML which conforms to XML rules), requires that tag names must be used in lowercase. It should be apparent therefore that it is considered best practice to use lowercase tag names in your style sheets.
There are two parts to a CSS rule: the 'selector' and the 'declaration'.
In the example: h2 {color: green;}, the selector is h2 - that is to say that this is the part of the rule which selects the content of the HTML document to which the rule will apply - in this case the h2 element. The second part of the rule: {color: green;} is what is known as the declaration and this has a CSS property ie the colour and also it has a value for that property which in this case is green.
The declaration must be finished off with a semicolon and the whole thing is wrapped in the curly type of brackets ({ }).