1.div+css佈局 <div>特征 ① 可以定義文檔中的分區或節（division/section） ② 可以把文檔分割為獨立的、不同的部分，可以用作嚴格的組織工具 ③ 是一個塊級元素，它的內容會自動開始一個新行 ④ 一般通過 id 或 class 標記與CSS配合使用 常用到的CSS屬性： w ...
1.div+css佈局
<div>特征
① 可以定義文檔中的分區或節（division/section）
② 可以把文檔分割為獨立的、不同的部分，可以用作嚴格的組織工具
③ 是一個塊級元素，它的內容會自動開始一個新行
④ 一般通過 id 或 class 標記與CSS配合使用
常用到的CSS屬性：
width:數值、height:數值、background-color:顏色、float-left（是div不占據一行）
2.background-color背景顏色
預設值是transparent（透明的）
當同時定義了背景圖像和背景顏色時，背景圖像將覆蓋背景顏色之上
顏色取值方式：
① 關鍵字，如red、blue等
② 16進位，如#000000、#cccccc、#ff0000等
③ rgb（0,0,0）
④ rgba（0,0,0, .n），n為0~1，透明度
3.background-image背景圖片
預設值是none（沒有圖片）
元素背景占據了元素的全部尺寸，包括內邊距和邊框，但不包括外邊距
通過url使用絕對或相對路徑指定圖片，background-image:url("");
4.background-repeat背景圖片是否重覆
常用屬性：
repeat，預設值，background-image預設水平方向和垂直方向平鋪顯示
repeat-x，背景圖片將在水平方向重覆
repeat-y，背景圖片將在垂直方向重覆
no-repeat，背景圖片將僅顯示一次
語法示例
body{
background-image: url("");
background-repeat: no-repeat;
}
5.background-size背景圖片尺寸
length，設置背景圖片的寬度和高度，第一個值設置寬度，第二個值設置高度，如果只設置一個值，則第二個值會被設置為“auto”
percentage，以父元素的百分比來設置圖片的寬度和高度，後文同上
cover，把背景圖片擴展至足夠大，以是背景圖片完全覆蓋背景區域，背景圖片某些部分也許無法完全顯示在背景區域中
contain， 把圖片擴展至最大尺寸，以使其寬度和高度完全適應內容區域，背景區域某些部分可能無法完全覆蓋
6.background-position背景圖片位置
position是相對於外部容器而言，非整個頁面
屬性值書寫方式：
① 使用方位關鍵詞定義，第一個值定義水平方向（left、center、right），第二個值定義垂直方向（top、center、bottom）
② 使用百分比定義，第一個值定義水平方向，第二個值定義垂直方向，左上角是“0% 0%”，右下角是“100% 100%”
③ 使用具體數字定義，第一個值定義水平方向，第二個值定義垂直方向，左上角是“0px 0px”
屬性特點：
① position的預設值為區域的左上角，即0點坐標
② 以上三種方式，如果僅定義了一個值，則另一個值為居中（center或50%）
③ 以上三種方式可以混合搭配使用
7.background-attachment背景圖片是否隨內容滾動
屬性值：
① scroll，預設值，隨頁面其餘部分的滾動而移動
② fixed，頁面滾動時，背景圖片不動
body{
background-image: url("");
background-attachment: scroll;
}
8.background簡寫
background 簡寫屬性可以在一個聲明中設置所有的背景屬性。
可以設置屬性如下：
background-color
background-image
background-repeat
background-attachment
background-position
background-size
如果不設置其中某個值，也不會出問題，自動取預設值
在書寫屬性值時，沒有嚴格順序要求，建議按照上文列表順序依次設置
