background(背景)
###### background-color(背景颜色)
###### background-image(背景图片)
格式:
background-image:url(./././img)
###### background-repeat(背景图片的平铺)
属性值:no-repeat;
repeat-x;
repeat-y;
repeat;
###### background-position(背景图片的定位)
属性值: 20px 20px;
10% 10%;
center center;
left;一个值时,水平自动剧中
###### background-attachment(背景图片的固定)
attachment(附加设备/附件)
属性值:scroll(默认值)
fixed(固定) 固定在浏览器窗口
###### background-size(背景图片的大小)
属性值:100px 100px;
100px 100px;
cover; 图像完全覆盖,有区域无法显示
contain; 把图像扩展最大尺寸,铺不满,就会**留白**
定位和大小用“/”隔开······定位在前,大小在后
background:red url() no-repeat position/size attachment
###### background-origin:指定背景图像的定位区域,通常与位置配合使用
可选值:
padding-box:从内边距开始计算
content-box:背景图片的偏移量从内容区计算
border-box:从边框开始计算偏移量
###### background-clip(背景图片覆盖区域)
属性值:border-box 默认值
padding-box 不包含边框
content-box 不包含外边距
###### 线性渐变(linear-gradient)
例:background:linear-gradient(red **10%**,green **90%**)
linear-gradient(**to right**,red 10%,green 90%)
linear-gradient(**to bottom right**,red 10%,green 90%)
linear-gradient(**0 deg**,red 10%,green 90%)
###### 径向渐变(radial-gradient)
格式:background:radial-gradient(60% 40%,shape(渐变的形状),closest-side,颜色 颜色)
shape(渐变的颜色)有·······**ellipse**(椭圆--默认值)/**circle**(圆形)
closest-side···最近边
farthest-side···最远边
closest-corner···最近角
farthest-corner···最远角