色婷婷狠狠18禁久久YY,CHINESE性内射高清国产,国产女人18毛片水真多1,国产AV在线观看

網頁制作過程中如何將本地圖片設置為背景并且可調大小

林子帆2年前57瀏覽0評論

網頁制作過程中如何將本地圖片設置為背景并且可調大小?

利用這個屬性:background-size

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

語法:

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

取值說明:

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

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

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

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

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

提示:大家可以在右邊的編輯窗口輸入自己的代碼嘗試不同取值的效果。

示例代碼:

<!DOCTYPE html><html><head> <meta charset="utf-8"><title>背景圖片大小</title><style type="text/css">.demo { background: url(http://static.mukewang.com/static/img/logo_index.png) no-repeat; width: 300px; height: 140px; border: 1px solid #999; background-size:cover;}</style> </head> <body><div></div></body></html>

css背景圖片縮放,網頁制作過程中如何將本地圖片設置為背景并且可調大小