网页中分成三个部分：结构（HTML），表现（CSS），行为（JavaScript），上次我们说了HTML的一些标签等等，这次我们来聊聊CSS把。
1.CSS介绍：
CSS是 “Cascading Style Sheet” 的缩写，中文意思为 “层叠样式表”，它是种标准的样式表语言，用于描述网页的表现形式，例如：网页元素的大小，颜色，位置等等。
CSS的主要作用是定义网页的样式，对网页中元素的位置、颜色、背景等属性进行控制。CSS不仅可以静态的修饰网页，也可以配合JavaScript动态的去修改网页中元素的样式。
2.使用CSS来修改元素的样式
第一种方式：内联样式，行内样式
在标签内部通过style属性来设置元素的样式
<p style="color: red; font-size: 50px;">君不见黄河之水天上来，奔流到海不复回。</p>
在这里我们p标签中的style后面带的属性就是我们的行内样式，但是这里我们也会有一定的问题：使用内联样式，样式只能对一个标签生效，如果希望影响到多个元素必须将每一个元素都复制一遍，不利于编写和维护。
第二种方式：内部样式表
将我们要编写的样式写到head中的style标签里，然后可以通过CSS的选择器来选中元素为其设置各种样式，可以同时为多个标签设置样式，并且修改时只需要修改一处即可全部用于标签。
<style>
p{
color: blue;
font-size: 50px;
}
</style>
内部样式表更加方便对样式进行复用，但同样也会有一些问题：我们的内部样式表只能对一个网页起作用，它里面的样式不能跨网页进行复用。
第三种方式：外部样式表
需要增加代码的复用率的话就可以用到外部样式表
这里是我们自己编写的style.css文件
p{
color:tomato;
font-size:50px;
}
然后在我们的html文件当中进行引入
<link rel="stylesheet" href="./style.css">
即可在html文件当中生效。
我们可以将CSS样式编写到一个外部CSS文件中，然后通过link标签来进行引入；
外部样式表需要通过link标签进行引入，这就意味着只要想使用这些样式的网页都可以进行对其进行引用，使样式可以在不同样式之间进行复用；
将样式编写到外部的CSS文件中，还可以使用浏览器的缓存机制，从而加快网页的加载速度，提供用户的体验。
3.CSS语法
CSS中的注释，注释的内容会自己被浏览器忽略
CSS的基本语法 选择器 声明块
选择器，通过选择器可以选中页面指定的元素 比如 p 作用就是选中页面中所有的p元素
声明块，通过声明块来指定要为元素设置的样式 声明块由一个一个的声明来组成 声明是一个名值结构 一个样式名对应一个样式值，名和值之间以:连接，以；结尾
4.CSS选择器
元素选择器
作用：根据标签名来选中指定元素；
语法：标签名{}；
例子：p{},div{},h1{}
id选择器
作用：根据元素的id属性值选中一个元素
语法：#id属性值{}
例子：#box{},#red{}
类选择器
作用：根据元素的class属性值选中一组元素
语法：.class属性值{}
通配选择器
作用：选中页面中的所有元素
语法：*
选择器的权重
样式的冲突 当我们通过不同的选择器，选中相同的元素，并且为相同的样式设置不同的值时此时发生了样式冲突
发生样式冲突时，应用哪个样式由选择器的权责（优先级）决定
选择器的权重 内联样式 1,0,0,0 id选择器 0,1,0,0 类和伪类选择器 0,0,1,0 元素选择器 0,0,0,1 通配选择器 0,0,0,0 继承的样式 没有优先级
比较优先级时，需要将所有的选择器的优先级进行相加计算，最后优先级越高，则越优先显示 选择器的累加不会超过其最大的数量级，类选择器在高也不会超过id选择器 如果优先级计算后相同，此时则优先级使用靠下的样式
可以在某一个样式后面添加!important，则此时该样式会获取到最高的优先级 注意：在开发中这个一定要慎用！！！
5.单位
长度单位： 像素 屏幕（显示器）实际上是由一个一个的小点点构成的 不同屏幕的像素大小是不同的，像素越小的屏幕显示的效果越清晰 所以同样的200px在不同的设备下显示效果不一样
百分比： 也可以将属性值为相对于其父元素属性的百分比 设置百分比可以使子元素跟随父元素的改变而改变
em em是相对于元素的字体大小来计算的 1em = 1font-size em会根据字体大小的改变而改变
rem rem是相对于根元素的字体大小来计算
