background-origin：控制背景图像的显示区域

2019独角兽企业重金招聘Python工程师标准>>>

默认情况下，background-position属性以元素左上角的原点为基准来定位背景图像。在css3.0中，新增的background-origin属性可以改变这种定位方式，使用其他方式控制背景图像的显示区域，使得在网页设计中能够增加灵活的对背景图像进行定位。background-origin只对：chrome和safari浏览器有效。

语法：

background-origin:border | padding | content

使用实例：

#pic{
	width:620px;
	height:342px;
	border:ridge #FFF 10px;
	padding:15px;
	background-image:url(../image/32202.jpg);
	background-repeat:no-repeat;
	-webkit-background-size:550px 322px;
	-webkit-background-origin:content;
}

效果：

添加    -webkit-background-size:550px 322px; -webkit-background-origin:content;前：

添加后：

 

转载于:https://my.oschina.net/u/2391658/blog/918578