HTML and CSS Reference
In-Depth Information
Table 8-1.
CSS Background Properties
Property
Initial Value
Description
background-color
transparent
Sets the background color of an element.
background-image
none
Sets the background image(s) of an element. IE 6-8
allow only one image.
background-repeat
repeat
Controls how background images repeat if smaller
than the element. By default, images tile horizontally
and vertically.
background-attachment
scroll
Determines whether the background image remains
in a fixed position or scrolls with the page.
background-position
0% 0%
Determines the background image's horizontal and
vertical position. The default is the top left of the
element.
background-origin
padding-box
Determines the point from which
background-
position
is measured. Not supported by IE 6-8.
background-clip
border-box
Determines the area covered by the background.
Not supported by IE 6-8.
background-size
auto
Controls the size of background images. Not
supported by IE 6-8.
background
See individual properties
Shorthand property for setting all background
properties in a single declaration.
Apart from
background-color
, all the individual properties are concerned with background images. The
background properties are not inherited, but the background of a parent element remains visible because
the default value of
background-color
is
transparent
.
Changing the Background Color of an Element
As you might expect, the
background-color
property takes as its value a color, which can be expressed in any of
the ways described in “Setting Color Values” in
Chapter 3
, namely:
•
A 3- or 6-digit hexadecimal number
•
A color keyword
•
An
rgb()
value
•
An
hsl()
value
A color with alpha transparency specified as an
rgba()
or
hsla()
value
Hexadecimal numbers, color keywords, and
rgb()
values are supported by all browsers. So, it's a good idea
to choose one of them unless you want to use a background color with alpha transparency. For example, the
background color for the
<body>
in background_alpha.html in the ch08 folder (see Figure
8-1
) is defined using
hexadecimal notation like this:
•
