Beginning CSS: Cascading Style Sheets for Web Design, Third Edition

2

The Bits that Make Up a Style Sheet

WHAT YOU WILL LEARN IN THIS CHAPTER:

• The elements that make up a style sheet
• The type of values that are used in CSS
• How to include CSS in HTML documents

In Chapter 1 you received a taste of what CSS is capable of in Example 1-1, a web page that contains the four gas giant planets of our solar system and some facts about them. In this chapter, you look at the elements that you combine to make a style sheet.

RULES

A style sheet can be broken down into progressively smaller bits. From large to small, those pieces are:

• Style sheet
• Rule
• Selector
• Declaration
• Property
• Value

Special characters — curly braces, colons, and semi-colons — are used to mark the beginning and ending of each part, separating them from each other. The following rule shows the parts of a style sheet and the special characters that separate them.

body {
    width: 650px;
    margin: 0 auto;
    background: #000;
    color: #FFF;
    font: 12px sans-serif;
}

You can layout the rule according to your preferences; you can add line breaks and spacing to make CSS readable, sensible, and organized, or you can put everything on one line if you prefer.

Like HTML, CSS can use white space and line breaks to aid readability. In most cases the interpreter reading the CSS doesn't care how much white space appears in the style sheet or how many line breaks are used; provided you have spaces where they are required you can use one or 10. Humans, however, must often add some sort of structure to prevent ...