背景颜色

background-color : 颜色值; 一般情况下元素背景颜色是transparent(透明)

背景图片

background-image :url(); emmet语法 big tab 常见于logo 和精灵图

背景平铺

background-repeat: repeat | no-repeat | repeat-x | repeat-y

repeat:背景图片向纵向和横向平铺

no-repeat: 背景图像不平铺

repeat-x ： 背景图片在横向上平铺

repeat-y： 背景图片在纵向上平铺

页面元素既可以加背景颜色也可以加背景图片 只不过背景图片会压住景颜色

背景图片的位置

background-position: x ,y;

length:百分数 | 由浮点数字和单位标识符号组成的长度值

position：top | center | bottom | left | center | right 方位名词

position：可以跟方位名词和 像素值

背景的固定

background-attachment : scrool | fixed

scrool 背景图像是随着对象内容滚动

fixed 背景图像固定

背景复合写法

background : 背景颜色 背景图片地址 背景平铺 背景图像滚动 背景图片位置

background：transparent url(image.jpg) repeat-y fixed top;

背景半透明

background:rgba(0,0,0,0.3);

`最后一个参数是alpha透明度 取值范围在0- 1之间

css三大特性

层叠性

样式冲突，遵循就近原则 哪个样式离解构近 就执行哪个样式

样式不冲突，不会层叠

继承性

子元素可以继承父元素的样式（text- ，font- ， line- 这些元素开头的可以继承 以及color属性）

行高的继承 font： 12px/1.5 '字体'; 行高：1.5是当前字体大小的1.5倍

body 行高1.5这样写法最大的优势在于里面的元素可以根据自己文字大小自动调整行高

body{
    font:12px/1.5 Microsoft YaHei;
}

优先级

• 选择器相同 则执行层叠型

• 选择器不同则根据权重执行

  

权重叠加

• div ul li ---0,0,03
• .nav ul li---0,0,1,2
• a:hover ---0.0.1.1
• .nav a ---0,0,1,1