背景图的渲染区域

背景图的渲染区域 

                                                                                   这几天在复习背景图的应用,感觉需要理解的还是有很多,

                                    背景颜色以及背景图的渲染应用范围其实有多种情况,这个时候就需要

                                    背景的剪切功能,来根据自身的需要来渲染自己需要的区域

 

       background-color:

                                                                              默认区域:border-box;(边框盒,包含:content   padding  border),

    当取值为:background-clip:content-box时就只渲染内容盒,会剪切掉border和padding

    区域的内容,即只在页面上展示content区域。

                                 background-clip:背景剪切    

    功能:背景色和背景图位置不会发生变化(当前标签的左上角)

                               background-origin背景图的起始位置

    取值:

             border-box:(默认值)边框盒的左上角

             padding-box:填充盒的左上角

            content-box;内容盒的左上角

原文地址:https://www.cnblogs.com/liqiang95950523/p/12937886.html