html 背景属性,HTML与CSS中背景相关属性

一.背景尺寸属性

1.什么是背景尺寸属性

背景尺寸属性是CSS3中新增的一个属性,专门用于设置背景图片大小

background-size:xxxx;

取值:

1.具体像素>>background-size:200px100px;

2.百分比>>background-size:100%80%;

3.宽度等比拉伸>>background-size:auto100px;

4.高度等比拉伸>>background-size:100pxauto;

5.cover>>background-size:cover;

5.1告诉系统图片需要等比拉伸

5.2告诉系统图片需要拉伸到宽度和高度都填满元素

6.contain>>background-size:contain;

6.1告诉系统图片需要等比拉伸

6.2告诉系统图片需要拉伸到宽度或高度都填满元素(只保证一边填满)

background-size

二.背景图片定位区域属性

background-origin:告诉系统背景图片从什么区域开始显示,默认情况下就是从padding区域开始显示;

取值:

1.padding-box:默认值>>background-origin:padding-box;告诉系统背景图片从什么区域开始显示,默认情况下就是从padding区域开始显示;

2.border-box>>background-origin:border-box;从border位置开始

3.content-box>>background-origin:content-box;从content位置开始

113-背景图片定位区域属性

• 默认
• padding
• border
• content