CSS样式背景属性概述

1.css样式主要背景属性

background：在一个声明中设置所有的背景属性

background-color：背景颜色

background-image：背景图片

background-repeat：背景的平铺方式

background-position：背景出现的初始位置

background-attachment：背景是否随页面滚动

注：背景颜色与背景图片一般不一起出现

2.背景图片的重复

background-image：设置背景图

background-image: url(路径);    <!--设置背景图片-->

background-repeat：背景图片的重复

平铺方式	含义
repeat	横纵向都平铺，不填时的默认值
repeat-x	横向平铺
repeat-y	纵向平铺
no-repeat	背景图不重复平铺

background-repeat: no-repeat;    /* 取消重复 */
background-repeat: repeat-x;	/* 横向重复 */
background-repeat: repeat-y;	/* 纵向重复 */

3.背景图片出现的位置

background-position：设置背景图出现的位置

属性值	含义
X         Y	使用具体的像素值表示背景出现的位置 第一个数值表示水平位置 第二个表示垂直位置
X方向关键词  Y方向关键词	使用关键词表示背景出现的位置 水平方向的关键词有left（居左）、center（居中）、right（居右） 垂直方向的关键词有top（居上）、center（居中）、bottom（居下）

background-position: 0px -49px;    <!--水平位置 纵向位置-->