HTML and CSS Reference
In-Depth Information
Figure 3.8: Background colors and element borders
he
background-color
property can also have the keywords
transparent
and
inherit
as values.
inherit
means to use the same background color as the
element's parent element, and
transparent
means to cancel any background
color the element has and let the parent element's background show through.
In addition to colors, an element's background can be illed with an image
using the
background-image
property and a URL value. CSS provides three
additional background properties to manage the position of the background
image. Here is an example showing all the background properties:
div.cute
{
background-color: pink;
background-image: url(images/cute.png);
background-repeat: no-repeat;
background-attachment: fixed;
background-position: top center;
}
Note that URLs in CSS are written without quotes and, in a stylesheet ile,
are relative to the stylesheet's location rather than the location of the HTML
ile. In addition to a URL, the
background-image
property can have the key-
word value
none
to remove any background image from previous settings.
Preference is given to the background image over the background color.
If a background image completely ills the element, none of the background
color will show unless the image itself has transparent areas. he
background-
repeat
property controls how the image ills the element if it is smaller than