可通过CSS的background属性设置HTML5页面背景：一、background-color设纯色；二、background-image设图片；三、background复合属性统一设置；四、background-size控图片尺寸；五、background-position精确定位。
如果您希望在HTML5页面中设置背景颜色或背景图片，可以通过CSS的background属性实现。以下是几种常用的方法：
一、使用background-color设置纯色背景
background-color属性用于为元素指定单一颜色作为背景，适用于整个页面或特定容器。该属性支持颜色名称、十六进制值、RGB/RGBA值等多种颜色表示方式。
1、在
2、使用颜色名称：background-color: blue;
立即学习“前端免费学习笔记（深入）”；
3、使用十六进制值：background-color: #f0f8ff;
4、使用RGB值：background-color: rgb(240, 248, 255);
5、使用RGBA值以支持透明度：background-color: rgba(240, 248, 255, 0.8);
二、使用background-image设置图片背景
background-image属性用于将图像文件设为元素背景，支持JPEG、PNG、GIF、SVG等格式。默认情况下图片会平铺填充整个背景区域。
1、在CSS中为目标元素添加background-image声明。
2、使用相对路径引用本地图片：background-image: url("images/bg.jpg");
3、使用绝对路径引用图片：background-image: url("/assets/background.png");
4、使用在线图片URL：background-image: url("https://example.com/bg.svg");
5、若图片路径错误，浏览器将无法加载图片，此时请检查路径是否拼写正确且文件实际存在。
三、使用background复合属性统一设置背景
background是简写属性，可同时定义背景颜色、背景图片、重复方式、定位、尺寸和滚动行为，避免多行冗余声明。
1、基础写法：background: #fff url("bg.jpg") no-repeat center center;
2、添加背景尺寸控制：background: #fff url("bg.jpg") no-repeat center center / cover;
3、添加背景固定效果（不随滚动条移动）：background: #fff url("bg.jpg") no-repeat center center / cover fixed;
4、若同时指定颜色与图片，颜色将作为图片未覆盖区域的后备显示内容。
四、使用background-size控制背景图片显示效果
background-size用于调整背景图片的尺寸，解决图片拉伸、裁剪或缩放问题，常与background-image配合使用。
1、设置为cover：background-size: cover; —— 图片等比缩放填满容器，可能被裁剪。
2、设置为contain：background-size: contain; —— 图片等比缩放至完全可见，可能留白。
3、设置为具体像素值：background-size: 800px 600px;
4、设置为百分比：background-size: 100% 100%; —— 拉伸填充，可能失真。
5、当使用cover或contain时，必须确保background-position已合理设定，否则关键内容可能偏移。
五、使用background-position精确定位背景图片
background-position用于指定背景图片在容器内的起始位置，影响图片可见区域，尤其在配合background-size: cover时至关重要。
1、使用关键词组合：background-position: top left;
2、使用偏移值：background-position: 20px 30px;
3、使用百分比：background-position: 50% 50%; —— 实现居中对齐。
4、混合使用：background-position: center bottom;
5、若图片关键视觉元素位于边缘，应避免使用center center导致其被裁剪。
