本文建立于2020年9月，以下為正文：
1.背景顔色 background-color
在HTML中，設定網頁的背景顔色利用< body>标記的bgcolor屬性。在CSS中，不但可以設定網頁背景顔色，還可以設定文字的背景顔色。
預設值是transparent（透明的） 當同時定義了背景圖像和顔色時，背景圖像将覆寫在背景顔色之上 .divclass{background-color:#808080;}
代碼示例：
< style>
div{
width:300px;
height:300px;
background-color:red;
}
< /style>
如果為整個頁面設定背景色，隻需要對< body>标記設定background-color屬性即可。
示例：
body{
background-color：#0FC；
}
圖例為：
background-color 顔色的取值：
1.關鍵字：red、blue等 2.16進制：#000000、#cccccc、#ff0000等 3.rgb（0，0，.5）
2.background-image 背景圖檔
預設值是none（沒有圖檔）
元素的背景占據了元素的全部尺寸，包括内邊距和邊框，但不包括外邊距
通過url使用絕對或相對位址指定圖檔
background-image：url("image/img.jpg");
url裡面是圖檔的路徑，設定整個頁面以這個圖檔為背景，如果圖檔不足以覆寫，則複制擴充。
3.background-repeat背景圖檔是否重複
repeat：預設。背景圖像将在垂直方向和水準方向重複
repeat-x：背景圖像在水準方向重複
repeat-y：背景圖像将在垂直方向重複
no-repeat ：背景圖像将僅先是一次
< body>
{
background-image:url(stars.gif);
background-repeat:no-repeat;
}
< /body>
4.background-size 背景圖檔大小
length：設定背景圖像的高度和寬度
第一個值設定寬度，第二個值設定高度
如果隻設定一個值，則第二個值會被設定為”auto“。
percentage：以父元素的百分比來設定背景圖像的寬度和高度
第一個隻設定寬度，第二個值設定高度
如果隻設定一個值，則第二個值會被設定為”auto“。
cover：把背景圖像擴充至足夠大，疑是背景圖像完全覆寫北京區域
背景圖像的某些部分也許無法顯示在背景定位區域中。
contain：把圖像擴充至最大尺寸，以使其寬度和高度完全适應内容區域。
長度值：CSS長度值，比如px、em
百分數：比如：100%
5.background-position 背景圖檔位置（相對于外層容器）
背景位置屬性用于設定背景圖像的位置，這個屬性隻能應用于塊級元素和替換元素。其中替換元素包括img、input、textarea、select和object。
當background-position取值為“像素值”
x（數值）：設定網頁的橫向位置，機關為px；
y（數值）：設定網頁的縱向位置，機關為px；
x% y%：第一個值是水準位置，第二個值是垂直位置。左上角是0% 0%，右下角是100% 100%。 如果僅規定了一個值，另一個值将是50%。
xpos ypos：第一個值是水準位置，第二個值是垂直位置.左上角是0 0.機關是像素（0px 0px）或任何其他的CSS機關。 如果僅規定了一個值，另一個值将是50%。可以混個使用%和position值。
當background-position取值為“關鍵字” 預設值：0% 0%
top left：左上
top center：靠上居中
top right：右上
left center：靠左居中
center ：正中
right center：靠右居中
bottom left：左下
bottom center：靠下居中
bottom right：右下
6.background-attachment：背景圖檔是否随内容滾動
scroll：預設值。背景圖像會随着頁面其餘部分的滾動而移動。
fixed：當頁面的其餘部分滾動時，背景圖像不會移動。
文法為：
body{
background-image：url(bgimage.gif)；
background-attachment：fixed；
}
7.background 背景
background簡寫屬性在一個聲明中設定所有的背景屬性
可以設定如下屬性：
background-color 、background-image、background-repeat、background-attachment、background-position、background-size
如果不設定其中的某個值，也不會出問題，取預設值，比如
background：url（’Smiley.gif‘）no-repeat
；也是允許的。