一、HTML关联样式方式

（1）link标签引入
（2）style标签里编写
（3）在style里用@import引入
（4）内联样式——在标签的style属性里编写

二、选择器

1、类型

（1）元素选择器（可分组）

如：div，img，h1{color:red;}

（2）类选择器（.）

按照class属性选择，如.btn{...}

（3）ID选择器（#）

按照id属性选择，如#first{...}

（4）属性选择器（[ ]）

• 按照元素的某个属性选择，如h1[class]{...}；
  
• 或具体属性值，如h1[class="aside"]；
  
• 或属性中的子字符串，如h1[class="asi"]；

（5）后代选择器

按元素的后代元素选择，如h1 em{...}

（6）选择子元素（>）

h1>strong{...}

（7）选择相邻兄弟元素（+）

选择紧接着某个元素的后一个元素，如h1+p{...}

（8）伪类选择器（:）

• 链接访问后a:visited{...}；
  
• 第一个子元素p:first-child{...}（p集合的第一个）

（9）伪元素选择器

??h2:before{...}

2、优先级

特殊性

• 1,0,0,0——内联样式
  
• 0,1,0,0——ID选择器
  
• 0,0,1,0——类、属性或伪类选择器
  
• 0,0,0,1——元素、伪元素选择器
  
• 0,0,0,0（无特殊性）——结合符（，）、通配符（*）选择器

（1）特殊性值可累加，越靠左特殊性越高，越优先。
（2）若特殊性相同，则写在后面的优先。
（3）样式中带有!important标志的优先性最高。
优先级
!important > 内联样式 > ID选择器 > 类、属性、伪类选择器 > 结合符、通配符

三、值和单位

1、颜色表示方法

• 命名颜色
• rgb颜色
• 16进制颜色：#FF0000
• rgba

2、单位

（1）绝对长度

• cm——厘米
• mm——毫米
• pt——点。标准印刷单位
• pc——12点

（2）相对长度

• em——相对于父元素字体大小
• rem——相对于根元素（html）的字体大小
• px——像素。取决于设备的分辨率。

3、其他单位

• deg——度
• grad——梯度
• rad——幅度
• s——秒
• ms——毫米

四、文本属性

• font-size——就是字体高度
• line-height——行框高
• vertical-align——垂直对齐方式

以上属性参考下图：