css背景样式---借鉴w3shool.com.cn_qtooltip 圆角-CSDN博客

本文链接：https://blog.csdn.net/emily_cxz/article/details/78623186

1、background

简写背景属性，顺序：background-color、background-position、background-size、background-repeat、background-origin、background-clip、background-attachment、background-image。可以不设置其中的某个值，则缺少的属性会是该属性的默认值。

2、background-color

背景色，颜色名、十六进制数、rgb()、transparent（默认值，透明）

3、background-image

背景图片，url(XXX)、none（默认）

4、background-repeat

背景图像的平铺方式，repeat（默认）、repeat-x(仅在水平方向重复)、repeat-y（仅在垂直方向重复）、no-repeat（仅出现一次）

5、background-position

背景图像的起始位置
背景图像如果重复，将从这一点开始。默认是元素左上角，这个左上角是background-origin属性规定的，默认为padding-box。属性值有：

·关键字。可按任何顺序出现，一个对应水平方向（left、right、center），一个对应垂直方向（top、bottom、center）即可。如果仅规定了一个关键词，那么第二个值将是"center"。
默认值：top left。

·x% y%，百分数。第一个值是水平位置，第二个值是垂直位置。左上角是 0% 0%。右下角是 100% 100%。如果仅规定了一个值，另一个值将是 50%。百分数数值同时应用于元素和图像，例如 50% 50% 表示图像中描述为50% 50%的点（中心点）与元素中描述为 50% 50% 的点（中心点）对齐。如果图像位于 0% 0%，其左上角将放在元素的左上角。如果图像位置是 100% 100%，会使图像的右下角放在右边距的右下角。

·xpos ypos,长度值。第一个值是水平位置，第二个值是垂直位置。左上角是 0 0。单位是像素 (0px 0px) 或任何其他的 CSS 单位。如果仅规定了一个值，另一个值将是50%。可以混合使用 % 和 position 值。是图像相对于元素左上角的偏移，偏移点是图像的左上角。

6、background-attachment

背景图像关联，scroll（默认，背景图像随页面一起滚动）、fixed（相对可视区固定）

7、background-size

CSS3样式，背景图片的尺寸（宽度和高度），默认为auto，即按实际尺寸显示。属性值有：

·length，长度值，第一个设置宽度，第二个设置高度，如果只设置一个值，则第二个被设为"auto"

·x% y%，百分数。相对元素的宽高百分比来设置。第一个设置宽度，第二个设置高度，如果只设置一个值，则第二个被设为"auto"。

·cover（把背景图像扩展至完全覆盖背景区域）、contain（把背景图像进行扩展，使其宽高完全适应内容区域）

8、background-clip