css 背景图片

背景图片

背景尺寸属性

background-size:100px 100px; 具体像素
background-size:50% 50%; 百分比
background-size:auto 100px; 宽度的等比拉伸
background-size:100px suto; 高度的等比拉伸
background-size:cover; 整体需要等比拉伸到高度和宽度都填满元素
background-size:contain; 等比拉伸到高度或宽度其中一个填满元素

背景图片的定位区域也就是告诉系统背景图片从什么区域开始显示

默认为从padding区域开始显示
background-origin:border-box; 从border开始显示
background-origin:content-box; 从content开始显示

背景绘制区域

默认为从border区域开始显示
background-clip:padding-box; 从padding开始绘制
background-clip:content-box; 从content开始绘制

多重背景图片

background:url(),url(); 多张背景图片用逗号隔开，先添加的背景图片会覆盖后添加的背景图片
background-size:cover,cover;属性也是逗号隔开设置