Background-size

#background-size 做用： 此屬性是改變背景尺寸的

經過各類不一樣是屬性值改變背景尺寸呈現的大小

#Background-size的語法

一、Background-size的語法

複製代碼代碼以下:

background-size: auto(原始圖片大小) || number(數值) || percentage(百分比) || cover(放大鋪滿) || contain(縮小鋪滿)

Background-size的屬性值

1. auto：此值爲默認值，保持背景圖片的原始高度和寬度;
2. number：此值設置具體的值，能夠改變背景圖片的大小;
3. percentage：此值爲百分值，能夠是0%〜100%之間任何值，但此值只能應用在塊元素上，所設置百分值將使用背景圖片大小根據所在元素的寬度的百分比來計算。
4. cover：此值是將圖片放大，以適合鋪滿整個容器，這個主要運用在，當圖片小於容器時，又沒法使用background-repeat來實現時，咱們就能夠採用cover;將背景圖片放大到適合容器的大小，但這種方法會使用背景圖片失真;
5. contain：此值恰好與cover相反，其主要是將背景圖片縮小，以適合鋪滿整個容器，這個主要運用在，當背景圖片大於元素容器時，而又須要將背景圖片所有顯示出來，此時咱們就能夠使用contain將圖片縮小到適合容器大小爲止，這種方法一樣會使用圖片失真。
6. 當background-size取值爲number和percentage時能夠設置兩個值，也能夠設置一個值，當只取一個值時，第二個值至關於auto，但這裏的auto並不會使背景圖片的高度保持本身原始高度，而會與第一個值相同。