1.为文档添加样式的三种方法
a.行内样式
b.嵌入样式
c.链接样式
在head标签插入如下代码引入外部样式表:
<link href="style.css" rel="stylesheet" type="text/css"/>
d.@import指令
@import url(css/style.css)
@import指令必须出现在样式表中其他样式之前，否则@import引用的样式不会被加载。
2.上下文选择符(后代组合式选择符)
格式：标签1 标签2 {声明}
实例：article p {font-weight:bold;}
Tip:上下文选择符以空格作为分隔符，而分组选择符则以逗号作为分隔符。
3.特殊的上下文选择符
3.1 子选择符 >
格式：标签1 > 标签2
实例：section > h2 {font-style:italic;}
说明：标签2必须是标签1的子元素，或者反过来说，标签1必须是标签2的父元素。与常规的上下文选择符不同，这个选择符中的标签1不能是标签2的父元素之外的其他祖先元素。
3.2 紧邻同胞选择符 +
格式：标签1 + 标签2
实例：h2 + p {font-variant:small-caps;}
说明：标签2必须紧跟在其他同胞标签1的后面。
3.3 一般通报选择符~
格式：标签1 ~ 标签2
实例：h2 ~ a {color:red;}
说明：标签2必须跟(不一定紧跟)在其他同胞标签1后面。
3.4 通用选择符 *
格式：* {...}
实例：* {color：green}
说明：会导致所有元素(的文本和边框)都变成绿色。
实例1: p * {color:red;} //p包含的所有元素文本变成红色。
实例2：section * a {font-size:1.3em;} //构成非子选择符。即任何section孙子元素，而非子元素的a标签都会被选中。
4. ID和类选择符
4.1 类属性
4.1.1 类选择符
格式：.类名
实例：.specialtext{font-style:italic;}
4.1.2 标签带类选择符
格式：标签名.类名
实例：p.speicaltext{color:red;}
4.1.3 多类选择符
格式：.类名.类名
实例：.specialtext.featured{font-size:120%};
说明：两个类名之间没有空格，选择的是同时具有这两个类名的那个元素。如果加了空格，就变成了“祖先/后代”关系的上下选择符。
4.2 ID属性
格式：#ID名 或 标签名#ID名
实例：#specialtext {CSS 样式声明}或者 p#specialtext {CSS 样式声明}