background-clip及backgound-origin效果比较

背景图片默认是从padding区域的左上角开始显示的

背景色默认是从border区域的左上角开始显示的

一.  background-clip:控制背景的显示区域(包括背景图片和背景色)

(1) background-clip:border-box;



(2) background-clip:padding-box;



(3) background-clip:content-box;

 


二.background-origin:控制背景图片（不控制背景色）出现的起点

(1) background-origin:border-box;

 background-position:0px 0px;



(2) background-origin:padding-box;   

 background-position:0px 0px;



与一(1)的效果一样

(3) background-origin:content-box;

 background-position:0px 0px;