HTML and CSS Reference
In-Depth Information
Border-spacing is used to set the amount of space desired between adjacent elements. The
following CSS will provide 250 px border spacing to all paragraph elements on the page:
p {
border-style: solid ;
border-color: black;
border-spacing: 250px;
}
Another border property that can be controlled with CSS is the border's width. The
border-width is a property that is set using a fixed measurement, in pixels for example. The
following code sets the width of the border to 5 px:
p {
border-style: solid ;
border-color: black;
border-spacing: 250px;
border-width: 5px;
}
Figure 4-11 demonstrates the new width set on the paragraph element.
FIGURE 4-11 A thicker width on the border of the paragraph element set by the border-width property
So far, you have been setting each of the properties of the border as individual lines in the
style sheet. The border CSS property supports a shorthand technique where you can specify
the key properties in a single line. The following code demonstrates this concept:
p {
border: 5px solid black;
}
In this case, the border is set to a 5-px width with a solid line and the color black.
EXAM TIP
The border element supports many variants in its ability to set properties in a single line.
Take some time to experiment with all the possible combinations so you will be able to
read them and identify them easily on the exam.
In addition to being able to set all the properties discussed so far in a single line, the
border element allows even more granular control. The properties discussed can also be set to
 
 
Search WWH ::




Custom Search