Background属性介绍

本次主题是css中background属性的介绍。为了更加的了解background（背景）属性我们需要先打开网页W3school。

随后我们看向网页的中心内容的导航栏，找到HTML/CSS。点击进去就会出现css的一系列属性。这个时候我们就只需要找到我们要了解的background（背景）属性。点击background（背景）属性我们可以看到它包含所有属性效果，这个时候我们就需要一个一个的使用属性观察每个属性不同的效果。（最快捷的方法就是直接在左侧的搜索框中输入background，这样就可以进入背景属性了）。

我们最常用，最熟悉的就给背景设置颜色background-color，这个属性可以接受任何色彩，当然不是所有。需要注意的是：background-color 不能继承，其默认值是 transparent。transparent 有“透明”之意。也就是说，如果一个元素没有指定背景色，那么背景就是透明的，这样其祖先元素的背景才能可见。

接下来是背景图像background-image，属性的默认值是none,表示背景上什么都没有放。如果需要设置一个背景图像，必须为这个属性设置一个nul值插入图片才能够实现。

background-repeat背景重复，使用效果就和它的属性名一样重复直到把背景铺满。repeat属性刚才也说了它会进行一个重复图像，按水平垂直方向平铺。repeat-x 和 repeat-y 分别导致图像只在水平或垂直方向上重复，no-repeat 则不允许图像在任何方向上平铺也就是我们说的不重复。默认情况下重复图像。如图所示：


background-position背景定位可以改变图像在背景中的位置，为 background-position 属性提供值有很多方法。首先，可以使用一些关键字：top、bottom、left、right 和 center（上、下、左、右）。通常，这些关键字会成对出现，不过也不总是这样。还可以使用长度值，如 100px 或 5cm，最后也可以使用百分数值（使用百分比去控制的时候偏差有时会比较大）。不同类型的值对于背景图像的放置稍有差异。使用起来的方法其实跟定位差不多。下面是它的等价位置关键字：

如果文档比较长，那么当文档向下滚动时，背景图像也会随之滚动。当文档滚动到超过图像的位置时，图像就会消失。这个时候我们就可以使用background-attachment属性就可以避免发生这种情况。代码如下：这里的图片需要进行一个替换。

以下是它其他的属性：

有的时候我们为了方便会直接写一个background后就加上它的一些属性值。写出来的效果就和前面那些一个单独背景属性的效果是一样的。