web前端入門到實戰：CSS背景background

一、背景顏色

background-color

取值：合法的顏色值和transparent

注：背景顏色和背景圖片，填充都是從邊框開始

二、背景圖片

background-image：url（圖片路徑）

三、背景圖平鋪

background-repeat：

取值：

repeat：平鋪

no-repeat：不平鋪

repeat-x：水平方向平鋪

repeat-y：垂直方向平鋪

四、背景圖定位

background-posion：x y,設定的值都是相對於瀏覽器，不是相對於容器

取值：

（1）：x，y都是以px爲單位的數字 +：右，下 -：左上

（2）x%  y%

（3）關鍵字 x：left/center/right  y：top/center/bottom

五、背景圖片的尺寸

background-size:x y

取值：

（1）x  y以px爲單位的數字

（2）x%  y% 相對原圖的%比

（3）cover：容器被圖片100%覆蓋，哪怕圖片顯示不全，也要把容器覆蓋

（4）contain：容器要把圖片100%包含起來，哪怕圖片縮小到看不到，也要把整張圖片都包含住
專門創建的學習Q-q-u-n⑦⑧④-⑦⑧③-零①② 分享學習方法和須要注意的小細節，不停更新最新的教程和學習技巧（從零基礎開始到前端項目實戰教程，學習工具，全棧開發學習路線以及規劃）

六、背景圖固定

將背景圖固定在網頁某個位置，一直處於可視區域中，不會隨着網頁滾動條滾動發生變化，可是會顯示在原容器中

background-attachment：

scroll 默認值

fixed：固定

七、背景簡寫方式

在一個背景中指定多個屬性值

background

取值：color url repeat attachment position