background样式所有设置参数

CSS 的 `background` 属性允许你设置元素的复杂背景样式，其主要设置参数可以分为以下几个部分：

1. **`background-color`**[^1]: 这个子属性用来设置元素的背景颜色，默认值是 `transparent`，你可以指定任何有效的颜色值（如 `red`, `#ff0000`, 或 `rgb(255, 0, 0)`）。

2. **`background-image`**: 设置背景图片，可以是一个URL、`none`（无背景图）、或者`repeating`/`repeat-x`/`repeat-y`/`no-repeat`来定义图案的重复方式。

3. **`background-position`**: 控制图片的位置，可以是百分比、长度单位或 `center`, `top`, `right`, `bottom`, `left` 等关键字。

4. **`background-size`**: 设置背景图片的尺寸，可以是具体像素值、`cover`（填充满容器），或是`contain`（保持原始比例填充容器）。

5. **`background-repeat`**: 告诉浏览器图片是否平铺(`repeat`)、水平重复(`repeat-x`)、垂直重复(`repeat-y`)，还是不重复(`no-repeat`)。

6. **`background-attachment`**: 如果背景图片是固定(`fixed`)的，它会随着页面滚动而滚动；如果设置为 `scroll` 则随内容滚动。

7. **`background-blend-mode`**: 可以改变背景颜色与内容之间的混合模式。

8. **`background-origin`**: 控制背景对齐的起点，可以是 `padding-box` (内边距盒)，`border-box` (边框盒)，或 `content-box` (内容盒)。

完整的语法示例：

element {
    background: 
        red; /* background-color */
        url('image.jpg') no-repeat center; /* background-image and position */
        cover; /* background-size */
        fixed; /* background-attachment */
        lighten(50%); /* background-blend-mode, 注意这不是标准CSS属性，仅支持某些浏览器 */
        padding-box; /* background-origin */
}