12.background属性

一。background属性

属性解释

            background属性是css中应用比较多，且比较重要的一个属性，它是负责给盒子设置背景图片和背景颜色的，background是一个复合属性，它可以分解成如下几个设置项：

1.background-color                设置背景颜色

2.background-image              设置背景图片地址

3.background-repeat             设置背景图片如何重复平铺

          background-repeat：repeat；     平铺所有的

          background-repeat：repeat-x；   只平铺x轴

          background-repeat：repeat-y；     只平铺y轴

          background-repeat：no-repeat；    不平铺，只平铺一次

4.background-position           设置背景图片的位置

水平方向：left  center  right

垂直方向：top   center  botton

background-position：cyan     背景不重复，背景和盒子左上角对齐，盒子其它部分显示背景颜色

background-position：cyan 。。。center     背景不重复，背景和盒子左中对齐，盒子其它部分显示背景颜色

background-position：cyan   。。。right  center    背景不重复，背景和盒子右中对齐，也就是背景图片的右边对齐盒子的右边，盒子其它部分显示背景颜色

5.background-attachment     设置背景图片是固定还是随着页面滚动条滚动

background-attachment：fixed；        背景不动

实际应用中，我们可以用background属性将上面所有的设置项放在一起，而且也建议这么做，这样做性能更高，而且兼容性也好。比如：background： color     image    repeat    position    attachment；  各个设置项用空格隔开，有的设置项不写也是可以的，他会使用默认值。