HTML and CSS Reference
In-Depth Information
Colors can be specified in a variety of ways, all of which are discussed in Lesson 9,
“Adding Images, Color, and Backgrounds.” Some colors can be specified by name, and
that's the method I've used so far in this lesson. Most of the time, when you use URLs,
they're used in the <a> tag or <img> tag. In CSS, they're usually included to specify the
location of a background image or a bullet image for a list. Generally, URLs are speci-
fied like this:
url( http://www.example.com/)
The Box Model
When working with CSS, it helps to think of every element on a page as being contained
within a box. This is true of inline elements like <a> or block-level elements like <p> .
Each of these boxes is contained within three larger boxes, and the entire set of four is
referred to as the CSS box model. Figure 8.2 shows a diagram of the box model.
FIGURE 8.2
The CSS box
model.
Top
Margin (Transparent)
TM
Border
TB
Padding
TP
Left
LM
LB
LP
Content
RP
RB
RM
Right
BP
BB
BM
Bottom
Margin Edge
Border Edge
Padding Edge
Content Edge
The innermost box contains the content of the element. Surrounding that is the padding,
then the border, and finally, the outermost layer (the margin). In addition to properties
that you can use to change how the content is displayed, CSS provides properties that
can be used to change the padding, border, and margins around each box. In this section,
you learn how to modify all the layers in the box model. If you get confused about how
the layers are ordered, just refer back to Figure 8.2.
 
 
Search WWH ::




Custom Search