background-clip
- 指定背景的填充范围，可指定为padding,border,content,分别表示填充至内边距，边框,默认为border。
- 值得注意的是在Firefox中该属性表现为-moz-background-clip,其他几个主流浏览器中表现为-webkit-background-clip
div{
background:green;
width:200px;
height:300px;
padding:30px;
border:dashed 10px black;
margin-left:30px;
-webkit-background-clip:content;
-moz-background-clip:content;
}
background-origin
- 在绘制背景图片时是默认从内部补白的左上角开始的，但我们可以利用这个属性对其做出改变
- 分别为padding,border,content,表示从内部补白、边框、内容区域左上角开始绘制
div{
-webkit-background-origin:padding;
-moz-background-clip:content;
}
background-size
- 该属性用于指定背景图片的的大小，有俩个参数分别为横向大小和纵向大小，当想要保持原图片大小比例时，可以只设置一个定值，另一个设置为auto
div{
background-size:30px auto;
}
同一元素内设置多张背景图片
- 在CSS3中可通过对关于背景图片的属性用逗号隔开，来对同一元素设置多个背景图片，如下：
div{
background-image:url(1.png),url(2.png),url(e.jpg);
background-repeat:no-repeat,repeat-x,repeat-y;
background-position:3% 98%,85%,center center;
}
