background-size
語法:background-size:[ , ]*
= [ | | auto ] | cover | contain
取值:auto 背景影象的真實大小,預設值
用長度值指定背景影象大小
用百分比指定背景影象大小
cover 將背景影象等比縮放到完全覆蓋容器,背景影象有可能超出容器
contain 將背景影象等比縮放到寬度或高度與容器的寬度或高度相等,背景影象始終被包含在容器內
說明:如果取值為2個,則第乙個定義寬度,第二個定義高度,如果只提供乙個,則只定義寬度,高度為auto。
相容性:(來自
一些**:
css[css]
view plain
copy
div
.cover
.contain
.percentage
.length
.auto_height
html
[html]
view plain
copy
<
div>
auto
div>
<
divclass
="cover"
>
cover
div>
<
divclass
="contain"
>
contain
div>
<
divclass
="percentage"
>
percentage
div>
<
divclass
="length"
>
length
div>
<
divclass
="auto_height"
>
auto_height
div>
效果:background-origin
語法:background-origin:[ , ]*
= border-box | padding-box | content-box
取值:padding-box 預設值,從padding區域(含padding)開始顯示背景影象
border-box 從border區域(含border)開始顯示背景影象
content-box 從content區域開始顯示背景影象
說明:該屬性計算背景影象background-position的參考原點(位置)
相容性:(來自
一些**:
css[css]
view plain
copy
div
.padding_box
.border_box
.content_box
html
[html]
view plain
copy
<
divclass
="padding_box"
>
padding-box
div>
<
divclass
="border_box"
>
border-box
div>
<
divclass
="content_box"
>
content-box
div>
效果:background-clip
語法:background-clip:[ , ]*
= border-box | padding-box | content-box | text
取值:border-box 預設值,從border區域(不含border)開始向外裁剪背景
padding-box 從padding區域(不含padding)開始向外裁剪背景
content-box 從content區域開始向外裁剪背景
說明:
指定物件的背景向外裁剪的區域
相容性:(來自
一些**:
css[css]
view plain
copy
div
.border_box
.padding_box
.content_box
html
[html]
view plain
copy
<
divclass
="border_box"
>
border-box
div>
<
divclass
="padding_box"
>
padding-box
div>
<
divclass
="content_box"
>
content-box
div>
效果:注釋:css3中,允許多背景影象,以上三個background屬性均支援對多背景影象定義。
CSS3 background新增屬性用法
1.background屬性列表 background color background position background size background repeat background origin background clip background attachment backgr...
css3 background屬性調整增強介紹
注 僅對css3對background的調整 增加的屬性進行了翻譯 css3對於backgrounds做了一些修改,最明顯的乙個就是採用設定多背景,不但新增了4個新屬性,並且還對目前的屬性進行了調整增強。1 多個背景 在css3裡面,你可以再乙個標籤元素裡應用多個背景。類似與css2.0版本的寫法,...
CSS3中background背景的使用
1.background漸變色例子 2.background clip裁剪區域 background clip有三種屬性 border,padding,content.分別指覆蓋border的區域,覆蓋padding區域裁剪border.覆蓋content區域裁剪border和padding.3.b...