开发工具与关键技术：DW
撰写时间：2021/7/7
CSS 背景属性用于定义HTML元素的背景。
CSS 属性定义背景效果:
- background-color 背景颜色
- background-image 背景图像
- background-repeat 设置背景图像在页面的水平或者垂直方向平铺与否。
- background-attachment 背景图像是否固定或者随着页面的其余部分滚动
- background-position 背景图像定位
1、background-color属性值可以用十六进制、英文、rgb（）
body { background-color:yellow; }
h1 { background-color:#00ff00; }
p { background-color:rgb(255,0,255); }
上面三种写法都是可以的
2、background-image
body {
background-image:url('paper.gif');
background-color:#cccccc;
}
url()指向背景图像的文件路径
元素的大小包括内边距，不包含边框；
默认情况下，background-image放置在元素的左上角，并重复垂直和水平方向。
属性值
| 值 |
说明 |
| url('URL') |
图像的URL |
| none |
无图像背景会显示。这是默认 |
| 创建一个线性渐变的 "图像"(从上到下) |
|
| 用径向渐变创建 "图像"。 (center to edges) |
|
| 创建重复的线性渐变 "图像"。 |
|
| 创建重复的径向渐变 "图像" |
|
| inherit |
指定背景图像应该从父元素继承 |
3 background-repeat 设置背景图像如何平铺
属性值
| 值 |
说明 |
| repeat |
背景图像将向垂直和水平方向重复。这是默认 |
| repeat-x |
只有水平位置会重复背景图像 |
| repeat-y |
只有垂直位置会重复背景图像 |
| no-repeat |
background-image不会重复 |
| inherit |
指定background-repea属性设置应该从父元素继承 |
4 background-position设置背景图像的定位
属性值
| 值 |
描述 |
| left top |
如果仅指定一个关键字，其他值将会是"center" |
| x% y% |
第一个值是水平位置，第二个值是垂直。左上角是0％0％。右下角是100％100％。如果仅指定了一个值，其他值将是50％。 。默认值为：0％0％ |
| xpos ypos |
第一个值是水平位置，第二个值是垂直。左上角是0。单位可以是像素（0px0px）或任何其他 CSS单位。如果仅指定了一个值，其他值将是50％。你可以混合使用％和positions |
| inherit |
指定background-position属性设置应该从父元素继承 |
5 background-attachment设置背景图像是否固定或者随着页面的其余部分滚动。
| 值 |
描述 |
| scroll |
背景图片随着页面的滚动而滚动，这是默认的。 |
| fixed |
背景图片不会随着页面的滚动而滚动。 |
| local |
背景图片会随着元素内容的滚动而滚动。 |
| initial |
设置该属性的默认值。 阅读关于 initial 内容 |
| inherit |
指定 background-attachment 的设置应该从父元素继承。 阅读关于 inherit 内容 |
这是我所学到的内容，所以我要分享给你们，希望可以帮助到你们。
以上就是我的分享，新手上道，请多多指教。如果有更好的方法或不懂得地方欢迎在评论区教导和提问喔！