CSS Backgrounds
You can use CSS background images in many places. If it has an element box, you can almost always apply a background to it.
The best place to start is with a survey of the CSS properties that affect background appearance, shown in Table 9-3.
Table 9-3. CSS background properties (default values shown in boldface)
Property | Purpose | Values |
---|---|---|
| Shorthand property, aggregates property/value pairs | |
| Prevents backgrounds of elements with scroll bars from scrolling along with content |
|
| Defines the background color |
|
| Specifies the background image to be applied to the element, which will be stacked over any background color |
|
| Contains horizontal and vertical values separated by a space; defines the relationship between the edges of the element and the edges of a background image |
|
| Specifies the axes along which the background image should repeat, if at all |
|
Setting background-position Values
When a background-position
value is provided, it should contain two components: the left offset and the
top offset. When length units such as px
or em
are used, the results are straightforward:
the background image is offset to the element coordinates specified. If
any of the values are negative, the top-left corner of the âfirstâ
instance of the background image will be laid out of view.
If percentage ...
Get HTML & CSS: The Good Parts now with the O’Reilly learning platform.
O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.