CSS 背景样式笔记（含示例+解释）

一、背景颜色（background-color）
语法：
background-color: 颜色值;
示例：
body {
background-color: #f0f0f0;
}

二、背景图片（background-image）
语法：
background-image: url(“图片路径”);
示例：
div {
background-image: url(“background.jpg”);
}

三、背景重复（background-repeat）
语法：
background-repeat: repeat | repeat-x | repeat-y | no-repeat;
示例：
div {
background-repeat: no-repeat;
}

四、背景位置（background-position）
语法：
background-position: x轴位置 y轴位置;
常用值：left, center, right, top, bottom, 或像素/百分比
示例：
div {
background-position: center center;
}

五、背景大小（background-size）
语法：
background-size: auto | cover | contain | 宽度 高度;
示例：
div {
background-size: cover;
}

六、背景附件（background-attachment）
语法：
background-attachment: scroll | fixed | local;
说明：
scroll：默认，背景随着页面滚动
fixed：背景固定不动
local：背景跟随元素滚动
示例：
div {
background-attachment: fixed;
}

七、背景简写（background）
语法顺序：
background: color image position / size repeat attachment;
示例：
div {
background: #fff url(“bg.jpg”) no-repeat center center / cover fixed;
}