元素的背景區(qū)包括前景之下直到邊框外邊界的所有空間，因此，內(nèi)容框和內(nèi)邊距都是元素背景的一部分，且邊框畫在背景之上。

網(wǎng)站建設(shè)允許應(yīng)用純色作為背景，也允許使用背景圖像創(chuàng)建相當(dāng)復(fù)雜的效果，CSS在這方面的能力遠(yuǎn)遠(yuǎn)在HTML之上。

背景色

類似于設(shè)置前景色，網(wǎng)站設(shè)計(jì)人員可以為元素的背景聲明一個(gè)顏色。為此，可以使用屬性background-color，毫不奇怪，它接受所有合法的顏色，還可以接受一個(gè)使背景透明的關(guān)鍵字。

background-color

值：<color> | transparent | inherit

初始值：transparent

應(yīng)用于：所有元素

繼承性：無(wú)

計(jì)算值：根據(jù)指定確定

如果網(wǎng)站設(shè)計(jì)人員希望背景色從元素中的文本向外稍有延伸，只需增加一些內(nèi)邊距，如圖9-8所示。

P{background-color:gray; padding:10px;}

圖9-8：背景和內(nèi)邊距

可以為幾乎所有元素設(shè)置背景色，這包括body一直到em和a等行內(nèi)元素。background-color不能繼承。其默認(rèn)值是transparent，這是有道理的：如果一個(gè)元素沒有指定的顏色，那么背景就應(yīng)當(dāng)是透明的，這樣其祖先元素的背景才能可見。

設(shè)計(jì)人員要了解這種繼承，可以想象訂在一個(gè)文字墻上的塑料標(biāo)志。透過(guò)這個(gè)標(biāo)志還可以看到墻，不過(guò)這不是標(biāo)志的背景，這是墻的背景（按CSS的術(shù)語(yǔ)來(lái)講）。類似地，如果為畫布設(shè)置一個(gè)背景，文檔中有些元素沒有自己的背景，那么透過(guò)所有這些元素都能看到這個(gè)背景。這些元素并沒有繼承背景，只是能透過(guò)它們看到背景而已?？瓷先ズ孟駴]有什么區(qū)別，不過(guò)在關(guān)于背景圖像的一節(jié)中你將了解到，這確實(shí)是一個(gè)重大差別。

大多數(shù)情況下都沒有必要使用關(guān)鍵字transparent，因?yàn)檫@是默認(rèn)值。不過(guò)，有些情況下這個(gè)關(guān)鍵字可能很有用。假設(shè)一個(gè)用戶將其瀏覽器設(shè)置為使所有鏈接都有一個(gè)白色背景。在網(wǎng)站設(shè)計(jì)頁(yè)面時(shí)，將錨設(shè)置為有一個(gè)白色前景，而且你不希望這些錨有背景。為了確保你的設(shè)計(jì)選擇可行，需要以下聲明：

a{color:white; background-color:transparent;}

如果沒有背景色，白色前景和用戶指定的白色背景就會(huì)混在一起，這樣一來(lái)鏈接將變得完全不可讀。盡管這個(gè)例子不太實(shí)際，不過(guò)確實(shí)是可能的。

注意：創(chuàng)作人員樣式和讀者樣式有可能結(jié)合，出于這個(gè)原因，網(wǎng)站建設(shè)檢驗(yàn)器會(huì)生成以下警告，“color沒有相應(yīng)的background-color"。這是在提醒你，創(chuàng)作人員指定的顏色與用戶指定的顏色可能發(fā)生交互，而你的規(guī)則沒有考慮到這種可能性。這些警告并不表示你的樣式無(wú)效：只有錯(cuò)誤才會(huì)導(dǎo)致檢驗(yàn)失敗。