插入方式的几种方式：
第一种：行内样式
通过元素的style属性，style="font-size:16px"
缺点：
（1）大量的重复代码，维护困难
（2）特殊效果无法实现，如：鼠标的移入等
第二种：内嵌样式
通过style元素实现，
<style>
p{font-size:16px}
</style>
假如有多个p元素，使用这种方式可以同时生效
缺点：
（1）无法跨文档重复使用
第三种：外联样式（推荐）
这种方式通过<link>来实现，具体方式是，将第二种方式里面的style内容提取出来，单独存放在一个css文件里，然后在文档中引入就可以了
<link rel="stylesheet" href="style.css">
外联样式详解
<link rel="stylesheet" href="style.css" type="text/css" media="all">
rel="stylesheet"：当前文档与资源之间的关系，合法的link元素必须要有rel属性
-超链接：
<link href="1.html" rel="prev" rev="next">
<link href="1.html" rel="next" rev="prev">
-外联资源
<link rel="icon" href="fac.png" size="16x16" type="image/png">，这一段定义了文档标题前面的小图标
<link rel="stylesheet" href="style.css">文档样式
多个rel关键字空格隔开
href="style.css"：引用资源的地址，合法的link元素必须要有href属性，必须是合法的URL地址；
type="text/css"：资源的MIME类型，可以不设置；
media="all"：描述资源生效时的媒体信息；
<link rel="stylesheet" href="style.css" type="text/css" media="(max-width:800px)">,当宽度低于800px的时候生效,注意：max-width外的（）不能少，少了就不生效了
<link rel="stylesheet" href="style.css" type="text/css" media="print">
视频演示练习，响应式：
<!DOCTYPE html>
<html lang="cn">
<head>
<meta charset="UTF-8">
<title>样式学习</title>
<link rel="stylesheet" href="css/style.css" media="all">
<link rel="stylesheet" href="css/style1.css" media="(max-width: 1600px)">
</head>
<body>
<div class="div1"></div>
<div class="div2"></div>
</body>
</html>
定义了两个css文件，第一个文件是默认生效的，第二个当页面宽度小于1600px时生效，针对两个<div>的样式随之改变，达到响应式的效果
思考练习：
当点击“页面打印”的时候时，希望显示为打印的页面效果
<link rel="stylesheet" href="style.css" media="print">