1.background-color:red ; //设置背景颜色为红色,rgb(0,0,0)和transparent 均为透明颜色

2.background-image(可缩bgi写用tab键)

      语法:background-image:url('图片的路径');

注意点:背景图片不会将原有的盒子撑开;如果一张图片占不满一个盒子,默认是在水平和垂直方向平铺的

3.背景平铺属性

background-repeat(简写bgr)

属性值

效果

no-repeat

不平铺

repeat-x

沿着水平方向平铺(x轴)

repeat-y

沿着垂直方向平铺(y轴)

 

4.背景位置

background-position(bgp)

            语法格式:background-position:水平方向位置  垂直方向位置;

         

css ios底部安区域背景色 css背景颜色位置_背景颜色

如果使用第二种方式,坐标轨迹规则:(盒子总大小是400*400px,则background-positon:200px 200px;则是y轴的一半和x轴的一半,即为右下角)

css ios底部安区域背景色 css背景颜色位置_属性值_02

 

 注意:两种方式可以混合使用,比如:background-position:center 200px;

总结:背景相关属性的连写的方式

属性名:background

      书写顺序推荐:background:color image repeat position

注意点:连写和单写同时出现,单写一定要放在连写的下面,否则会覆盖属性;

 

扩展:img标签和背景图片的区别

注意:背景图片要想显示出来效果,要配合标签使用,并设定宽和高;而img标签是不需要的