背景图片的设置(详解)

背景图片的设置(详解)

背景图片主要有以下几个属性：

• background-image

background-image: url('播放按钮.png');

• background-repeat

background-repeat: no-repeat;

• background-position

background-position: center top;

• background-attachment

background-attachment: scroll;

1. background-image
   此属性后面跟图片的路径(url(‘1.jpg’))，注意一定要把路径写对，注意是绝对路径还是相对路径，否则图片引入不进来
2. background-repeat
   此属性用来设置背景图片平铺还是不平铺，若装背景图片的盒子远远大于背景图片的大小，那么默认情况下会在X方向和Y方向平铺。默认在X和Y方向都平铺，此属性有三个属性：

属性值	特点
repeat-X	在X方向平铺
repeat-Y	在Y方向平铺
no-repeat	不平铺
repeat	在X，Y上都平铺

3. background-position
   此属性用来设置背景图片在盒子里的位置，可以设置X，Y方向上的偏移量(50% 50%)，显示在正中间，也可以使用方位名词(center top)，显示在中上方，默认显示在左上角
4. background-attachment
   此属性用来设置背景图片是否随滚动条的滚动来滚动，属性值为scroll(滚动)和fixed(固定)