4 - CSS Syntax

Style rules are comprised of two things, the selector and the declaration.

• selector - The HTML tag that will be affected by the rule
• declaration - The specific style calls that will affect the selector

The complete syntax for a style rule is:

selector {property : value;}

So, to set all bold text to be the color red, you would write:

b {color: red;}

One of the things that makes CSS so easy to use, is that you can group together components that you would like to have the same style. For example, if you wanted all the H1, H2 and bold text red, you could write:

 b {color: red;}
 h1 {color: red;}
 h2 {color: red;}

But with grouping, you put them all on the same line:

b, h1, h2 {color: red;}

You can also group together rules (separated by a semi-colon (;) ). For example, to make all h3 text blue and Arial font, you would write:

h3 {
   font-family: Arial;
   color: blue;
 }

By convention, we put separate rules on separate lines, but this is not required.