css背景有关的属性详细介绍
2020-11-27
来源：骅佗教育
印象中css控制背景的就一个background，但是background是一个复合属性
它包括：
background-color：背景颜色，css支持的颜色表示方法，都可以用
background-image：背景图片（url）
background-repeat：背景是否重复（repeat、no-repeat、repeat-x、repeat-y）
background-position：背景定位（关键字、百分比、像素）
background-size：背景大小
background-origin：背景的定位区域
background-clip：背景绘制区域
background-attachment：规定背景图像是否固定或者随着页面的其余部分滚动
除了这些，多背景、渐变、遮罩，我也把他们归到背景里吧。
一个个看看吧-0-。
开头说了，我很长时间都以为背景就是background这一个单词的玩意。因为我总是写成：
.p{
background: #000 url("1.jpg") no-repeat left center;/*颜色、图片、是否平铺、定位*/
}不知道大家是不是也像我这样写啊。很简单吧，背景颜色、背景图片、是否重复、定位4个属性连着写。
下面说其他属性
背景的定位区域（background-origin）：值是关键字，有3个
.div{
width: 400px;
height: 200px;
padding: 20px;
border:10px solid rgba(255,255,255,.2);
background: #000 url("1.jpg") no-repeat;
background-origin:border-box;
/*background-origin:padding-box;*/
/*background-origin:content-box;*/
}border-box
padding-box
content-box