background-clip与background-origin两者的区别

第一篇随笔有提到 background-clip与background-origin两者的区别，但是太字面化了，对于小白而言甚是难以理解，包括我自己，在第二次去理解的时候，反而蒙圈了。所以，查阅了一些资料，用自己的理解，简单点，简单点，简单点。。。

 

 

background-clip指定了背景可以覆盖到什么范围，包括覆盖到了那个位置上（例如：设置background-origin ：border，则实际的效果是从border开始，并覆盖了border）。 

 

background-origin指定了背景从什么位置开始，不包括那个位置（例如：设置background-origin ：border，则实际的效果是从padding开始，并不覆盖border）。

 

background-clip会比较有用，毕竟显示背景一般都希望在内容区显示，这样就可以设置padding而不用担心背景会出现在padding区域。

 

background-origin 设置padding，背景会出现在padding区域。