（一）css简介及基本语法
- 什么是CSS：Cascading Style Sheet层叠样式表，用于修饰和美化HTML标签的一种计算机语言，能够实现结构表现的分离。
- CSS基本语法
选择器{
属性：属性值;
属性：属性值;
……
} - 选择器：选择器也叫作选择符，作用是告诉浏览器，样式的应用对象
选择器的种类：标签选择器（元素选择器）、类选择器、id选择器、全局选择器（通配符选择器）、群组选择器、子集选择器、后代选择器、属性选择器、动态伪类选择器…..
a. 标签选择器（元素选择器）：拿HTML标签做选择器，作用是使文档中的相同标签应用相同样式
b. 类选择器：作用是对某个元素单独设置样式，进行修饰- 第一步：设置名称
<p class="类名"></p> - 第二步：设置样式/类名{样式}
- 类选择器的注意事项
1.类的名称的命名规则
由字母、数字、下划线构成
不可以有汉字
不可以以数字开头
不可以是关键字
2.一个文档中类名可以相同
3.一个类可以有多个名
c. id选择器：作用是对某个元素单独设置样式，进行修饰
- 第一步：设置名称
- 第二步：设置样式 #id名{样式}
- 注意：类选择器和id选择器的区别是
1.一个文档中，类名可以相同，但是id名不可以重复
2.id的权重大于类的权重，换句话id的样式优先于类的样式
d. 全局选择器（通配符选择器）：使用*号作为选择器，作用是使所有元素应用同种样式
e. 群组选择器：就是指用逗号将多个选择器分隔开，是它们形成一个组，应用同种样式
f. 动态伪类选择器- :link 默认样式(应用对象是超级链接)
- :visited 访问过后的样式（应用对象是超级链接）
- :hover 鼠标滑过元素时的样式（应用对象可以是超级链接，也可以是其它元素）
- :active 鼠标激活时的样式（应用对象可以是超级链接，也可以是其它元素）
- 在使用四个动态伪类时一定要注意顺序问题：LVHA
- :focus 获得焦点时的样式
- 第一步：设置名称
（二）css样式表
样式表的应用：行内样式表、内部样式表、外部样式表、导入样式表
a. 行内样式表：指将样式表写在HTML标签的开始标签中，用style做关键字，行内样式表通常用来修饰个别的局部元素,弊端是没有实现结构和表现的分离，所以行内样式使用的频率并不高
b. 内部样式表（内嵌样式表），通常写在HTML文档的标签中，格式如下
<head>
<style type="text/css">
样式
</style>
</head>
注意：当对一个文档做样式的修饰时，可以选用内部样式表，弊端也没有真正实现结构和表现的分离
c. 外部样式表：所谓外部样式表是指将CSS样式写在一个单独的CSS文件中，然后使用标签将CSS文件和HTML文件关联起来，该种样式表真正实现了结构和表现的分离，是我们学习和工作中最为常用的一种样式表
格式：
<head>
<link rel="stylesheet" type="text/css" href="CSS文件的路径" />
</head>
d. 导入样式表：只做了解
<head>
<style type="text/css">
@import "样式表的路径";
</style>
</head>样式表的优先级
行内样式表的优先级>内部样式表的优先级
内部样式表和外部样式表的优先级取决于样式表的加载顺序，后加载的样式表优先显示
就近原则样式表的特性：样式表的继承、样式表的覆盖
继承：后代元素会从祖先元素那里继承样式
覆盖：如果选择器的权重相同，那么同种属性，后设置的样式会覆盖先设置的样式CSS样式的注释
HTML文档的注释：
<!--注释内容-->
CSS文档的注释：/*注释内容*/
注释的好处- 结构清晰，方便维护
- 有利于代码调错