- 1 选择器（重点）
1.1 标签选择器
标签选择器是指用HTML标签名称作为选择器，按标签名称分类，为页面中某一类标签指定统一的CSS样式。其基本语法格式如下：
|
标签名{属性1:属性值1; 属性2:属性值2; 属性3:属性值3; } 或者 元素名{属性1:属性值1; 属性2:属性值2; 属性3:属性值3; } |
标签选择器最大的优点是能快速为页面中同类型的标签统一样式，同时这也是他的缺点，不能设计差异化样式
1.2 类选择器
类选择器使用“.”（英文点号）进行标识，后面紧跟类名，其基本语法格式如下
|
.类名{属性1:属性值1; 属性2:属性值2; 属性3:属性值3; } |
|
标签调用的时候用 class=“类名” |
|
小技巧： 1.长名称或词组可以使用中横线来为选择器命名。 2.不建议使用“_”下划线来命名CSS选择器。 3.不要纯数字、中文等命名， 尽量使用英文字母来表示。 |
1.3多类名选择器
|
标签调用的时候用 class=“类名1类名2” |
1.4 id选择器
|
#id名{属性1:属性值1; 属性2:属性值2; 属性3:属性值3; } |
该语法中，id名即为HTML元素的id属性值，大多数HTML元素都可以定义id属性，元素的id值是唯一的，只能对应于文档中某一个具体的元素。
|
字体风格 |
描述 |
|
类选择器 |
好比人的名字，是可以多次重复使用的，比如张伟王伟李伟李娜 |
|
id选择器 |
好比人的身份证号码，全中国是唯一的，不得重复。只能使用一次 |
|
id选择器和类选择器最大的不同在于使用次数上 |
|
1.5 通配符选择器
通配符选择器用“*”号表示，他是所有选择器中作用范围最广的，能匹配页面中所有的元素。其基本语法格式如下：
|
* { 属性1:属性值1; 属性2:属性值2; 属性3:属性值3; } |
1.6 伪类选择器
1.6.1 链接选择器
|
选择器 |
描述 |
|
:link |
未访问的链接 |
|
:visited |
已访问的链接 |
|
:hover |
鼠标移动到链接上 |
|
:active |
选定的链接 |
1.6.2 结构选择器
|
选择器 |
描述 |
|
:first-child |
选取属于其父元素的首个子元素的指定选择器 |
|
:last-child |
选取属于其父元素的最后一个子元素的指定选择器 |
|
:nth-child(n) |
匹配属于其父元素的第 N 个子元素，不论元素的类型 |
|
:nth-last-child(n) |
选择器匹配属于其元素的第 N 个子元素的每个元素，不论元素的类型，从最后一个子元素开始计数。 n 可以是数字、关键词或公式 |
|
标签名{属性1:属性值1; 属性2:属性值2; 属性3:属性值3; } 或者 元素名{属性1:属性值1; 属性2:属性值2; 属性3:属性值3; } |