1. 程式人生 > 實用技巧 >CSS3背景 background-size

CSS3背景 background-size

設定背景圖片的大小,以長度值或百分比顯示,還可以通過cover和contain來對圖片進行伸縮。

語法:

background-size: auto | <長度值> | <百分比> | cover | contain

取值說明:

1、auto:預設值,不改變背景圖片的原始高度和寬度;

2、<長度值>:成對出現如200px 50px,將背景圖片寬高依次設定為前面兩個值,當設定一個值時,將其作為圖片寬度值來等比縮放;

廣州vi設計http://www.maiqicn.com 辦公資源網站大全https://www.wode007.com

3、<百分比>:0%~100%之間的任何值,將背景圖片寬高依次設定為所在元素寬高乘以前面百分比得出的數值,當設定一個值時同上;

4、cover:顧名思義為覆蓋,即將背景圖片等比縮放以填滿整個容器;(相比以contain,貼滿兩邊)

5、contain:容納,即將背景圖片等比縮放至某一邊緊貼容器邊緣為止。