background size使用詳解

2022-09-24 20:27:12 字數 517 閱讀 5932

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

語法:background-size: auto | 長度值》 | 百分比》 | cover | contain程式設計客棧

取值說明:

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

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

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

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

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

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

複製**

**如下:

背景大小

本文標題: background-size使用詳解

本文位址:

background size屬性詳解

css background size 屬性詳解,background size 指定背景影象大小,以象素或百分比顯示,當指定為百分比時,大小會由所在區域的寬度 高度以及 background origin 的起始位置 的位置決定,還可以通過 cover 和 contain 來對進行伸縮。backg...

background size屬性詳解

cssbackground size屬性詳解,background size指定背景影象大小,以象素或百分比顯示,當指定為百分比時,大小會由所在區域的寬度 高度以及background origin 的起始位置 的位置決定,還可以通過cover和contain來對進行伸縮。background si...

background size屬性的使用方法

background size有幾個預定義的值,但也可以像其它size屬性一樣使用數字 contain 包含,整個背景圖都要被包含在元素內,沒有超出的部分。cover 覆蓋,背景要覆蓋元素的所有區域,不能有空白出現。長度 百分比 數字值 使用 length percentage 時,第乙個值是指背景...