1.設置背景顏色
在CSS中，使用 background- color屬性來設置網頁元素的背景顫色，其屬性值與文本顏色的取值一樣，可使用預定義的顏色值、十六進制# RRGGBB或RGB代碼rgb(r.g.b),background- color的默認值為 transparent,即背景透明，此時子元素會顯示其父元素的背景。
下面通過一個案例來演示 background- color屬性的用法。新建HTML頁面，在頁面中添加標題和段落文本，然后通過 background- color屬性控制標題標記<h2>和主體標記<body>的背景顏色。
在上例中，通過 background- color屬性分別控制標題和網頁主體的背景顏色。
在圖中，標題文本的背景顏色為黃色，段落文本顯示父元素body的背景顏色。這是由於未對段落標記<p>設置背景顏色時，會默認為透明背景( transparent),所以段落將顯示其父元素的背景顏色。
2.設置背景圖片
背景不僅可以設置為某種顏色，還可以將圖像作為元素的背景。在CSS中通過background-image屬性設置背景圖像，
示例代碼：
效果：
如果圖片是小尺寸的話，背景圖像會自動沿着水平和豎直兩個方向平鋪，充滿整個頁面，並覆蓋boby的背景顏色值。
3.背景與圖片不透明度設置
3.1 RGBA模式
RGBA是CS3新增的顏色模式，它是RGB顏色模式的延伸，該模式是在紅、綠、藍三原色的基礎上添加了不透明度參數。其語法格式為：
raba(r,g,b,alpha);
在上面的語法格式中，前三個參數與RGB中的參數含義相同， alpha參數是一個介於0.0（完全透明）和1.0（完全不透明）之間的數字。
例如，使用RGBA模式為p元素指定透明度為0.5,顏色為紅色的背景，代碼如下。
p{background-color:rgba(255,0,0,0.5);}
3.2 opacity屬性
在CSS3中，使用 opacity屬性能夠使任何元素呈現出透明效果。其語法格式為
opacity:opacityValue;
在上述語法中， opacity屬性用於定義元素的不透明度，參數 opacityValue表示不透明度的值，它是一個介於0~1的浮點數值。其中，0表示完全透明，1表示完全不透明，而0.5則表示半透明。
示例：
4.設置背景平鋪
默認情況下，背景圖像會自動沿着水平和豎直兩個方向平鋪，如果不希望圖像平鋪，或者只沿着一個方向平鋪，可以通過 background- repeat屬性來控制，該屬性的取值如下。
- repeat:沿水平和豎直兩個方向平鋪（默認值）
- no- repeat:不平鋪(圖像位於元素的左上角，只顯示一個)。
- repeat-x:只沿水平方向平鋪。
- repeat-y:只沿豎直方向平鋪
5.設置背景圖像位置
如果將背景圖片的平鋪屬性background-repeat定義為no-repeat，圖像將默認以元素的左上角為基准點顯示。
示例：
效果：
在示例中，將body的背景圖設置為不平鋪，在瀏覽器中運行，背景圖位於HTML頁面的左上角，即body元素的左上角。
若是希望背景圖片出現在其它位置，就需要另一個CSS屬性background-position，設置背景圖像的位置。
示例：
如圖中代碼和效果所示，背景圖像出現在了右上角。
在CSS中，background-position屬性的值通常設置為兩個，中間用空格隔開，用於定義背景圖像在元素的水平和垂直方向的坐標，如上面的" right top"。 background- position屬性的
數認值為“0 0” 或" lefttop”，即背景圖像位於元素的左上角。
background-position屬性的取值有多種，具體如下。
(1)使用不同單位(最常用的是像素px)的數值：直接設置圖像左上角在元素中的坐標，如" background- position:20px 20px;”。
(2)使用預定義的關鍵字：指定背景圖像在元素中的對齊方式
- 水平方向值：left、 center、 right。
- 垂直方向值：top、center、bottom。
兩個關鍵字的順序任意，若只有一個值則另一個默認為 center。例如：
center 相當於 center center（居中顯示）
top 相當於 center top(水平居中、上對齊)。
(3)使用百分比：按背景圖像和元素的指定點對齊。
- 0%0% 表示圖像左上角與元素的左上角對齊。
- 50%50% 表示圖像50%50%中心點與元素50%50%的中心點對齊。
- 20%30% 表示圖像20%30%的點與元素20%30%的點對齊。
- 100%100% 表示圖像右下角與元素的右下角對齊，而不是圖像充滿元素。
如果只有一個百分數，將作為水平值，垂直值則默認為50%。
接下來將 background- position的值定義為像素值來控制下面例子中背景圖像的位置，body的CSS樣式代碼如下。
