We've seen quite a few CSS examples in this chapter. When you get more serious about CSS, you're going to need very in-depth information. For that reason, the rest of this chapter covers the most commonly used CSS styles and their formal specifications. The World Wide Web Consortium (W3C) CSS style specifications give the possible values that CSS properties can take, the default value of those properties, and so on. The syntax that the W3C specifications use is a little complex. Here's an example: the style specification for the background- color property: background-color
Here you can see the way a style is specified, listing the possible values that the property can take for the CSS1 level specification, as well as the possible values that CSS2 adds, the property's default value, which types of elements are supported (such as block-level elements), and whether the style is inherited by child elements. I'm also adding which of the two major browsers support the property and what versions of those browsers do. Note the expression <color> transparent , which indicates the possible values you can assign this property. This expression means that you can set the background-color property to either a valid color value or the word transparent . The W3C syntax for style properties like this is worth getting to know so that you can refer to the W3C documentation when you need it. Here's the syntax the W3C uses:
The expressions you see in angle brackets, such as <color> , use a specific format, and I list those formats in Table 9-1. For example, there you'll see that <color> can be set to a red, green, blue triplet color value or a predefined color. That means you could assign a color value to the background-color property like this in a style rule: {background-color: #0000ff} or {background-color: azure} . Table 9-1. Units in the W3C Property Style Specifications
You also should know about two special property values: auto and a new CSS2 value, inherit . You set a property to auto when you want the browser to assign an automatic value to the property. Usually, the value set depends on the context, such as the style or color of surrounding text. The inherit value is new in CSS2 and means that the value of this property should be inherited from its parent (instead of using the default initial value), if the element has a parent. There's one more term to understand as well: box. A box is the area in which an element is drawn in the browser. That is, the box is the invisible rectangle surrounding the display area of the element. Because boxes are constructed with borders, padding, and margins, many style properties refer to them. That's all the introduction we need to the actual style property specifications. I'll look at the most common style properties now, as well as the values they can take and what kind of elements you can use them with. Bear in mind that you can find the complete CSS property specifications at www.w3.org/TR/REC-CSS1 and www.w3.org/TR/REC-CSS2.
|