1. Home
  2. Computing & Technology
  3. Web Design / HTML

CSS 101
Lesson 1: CSS Syntax

By , About.com Guide

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.

Next Page: Placement of CSS Elements > 1, 2, 3, 4, 5

Explore Web Design / HTML
About.com Special Features

The Best Web Trends of the Decade

A look back at the best innovations, ideas and technologies over the last 10 years, More >

Family Tech Center

Stay connected and entertained with reviews on tips on the latest HDTVs, cellphones and more. More >

  1. Home
  2. Computing & Technology
  3. Web Design / HTML

©2010 About.com, a part of The New York Times Company.

All rights reserved.