CSS背景属性

目录

背景重复

背景位置

背景附着

背景尺寸

背景属性简写

---

背景图像

background-image 属性指定用作元素背景的图像。

通过以上格式找到url中指定路径的图片覆盖div盒子成为其背景图像。

当图片小于该元素时默认情况下会重复图像以覆盖整个元素；

背景重复

background-repeat 属性指定背景图像元素中的覆盖方式

repeat : 背景图像在纵向和横向上平铺(默认值)

no-repeat : 背景图像不平铺（不平铺时与元素左上角对齐）

repeat-x : 背景图像沿x轴(横向)平铺

repeat-y : 背景图像沿y轴(纵向)平铺

背景位置

background-position 属性指定背景图像的起始位置

该属性可以使用三种类型的值；

可以混合使用只能有两个值分别代表X轴与Y轴（这是固定顺序）。

在只设置一个值的情况下该值代表X轴，Y轴默认为居中。

背景附着

background-attachment 属性指定背景图像是否固定或者随着页面的其余部分滚动。

scrol ：默认值。背景图像会随着页面其余部分的滚动而移动。

fixed：当页面的其余部分滚动时，背景图像不会移动。

inherit：规定应该从父元素继承 background-attachment 属性的设置。

背景尺寸

background-size 属性规定背景图像的尺寸。

背景属性简写

background 属性规定所有背景属性。

 使用默认值的属性可以可以省略，必须按照此顺序书写。