一. link元素
link元素是外部资源链接元素，规范了文档与外部资源的关系，link元素通常是在head元素中。有两种常用的属性：
- href：既然是链接外部资源的元素，那么此属性指定被链接资源的URL
- rel：外部资源的类型，前面使用的引入外部CSS资源，其值就是stylesheet；还有个取值就是站点图标icon，如下图的juejin图标就是站点图标。
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>京东(JD.COM)-正品低价、品质保障、配送及时、轻松购物！</title>
<!-- 引入css -->
<link rel="stylesheet" href="./css/style.css">
<!-- 引入icon(站点的图标) -->
<link rel="icon" href="../images/favicon.ico">
</head>
<body>
</body>
</html>
二. 在CSS中的颜色表示方式
- 颜色关键字
前面很多案例中，都是使用的颜色关键字如color:red/green...但是不可能把全部的颜色的关键字都背下来，且往往语言是无法描述更加细化的颜色，就是文字无法描述完全部的颜色 - rgb()
rgb是一个函数，中间填入三原色的值，分别是rgb(红色,绿色,蓝色)这三个取值都是0-255，通过不同的比例显示出不同的颜色 - 十六进制
十六进制表示法其实就是rgb的延伸，将原本的三原色的取值转换成十六进制，在其前面加上#，如#aabbcc(可简写为#abc)，#e1251b；
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
/* 值: 单词 red/white/black......... */
.box {
/* color: red;
background-color: black; */
/* 黑色是最纯洁的颜色 */
background-color: rgb(100, 100, 100);
background-color: #646464;
/* 表示一个纯黑色 */
background-color: rgb(0, 0, 0);
background-color: #000000;
background-color: #000;
/* 表示一个纯白色 */
background-color: rgb(255, 255, 255);
background-color: #FFFFFF;
background-color: #e1251b;
}
</style>
</head>
<body>
<div class="box">哈哈哈</div>
</body>
</html>
三. 浏览器渲染流程
浏览器访问网页，服务器则会响应index.html文件，浏览器下载并且从上到下解析该文件，当访问到外部资源时，如外部的CSS文件，则会分出一个支去下载和解析该外部资源，主支流继续往下解析，当index.html解析完毕后会生成一颗DOM树，并且会等待外部资源解析完成，挂载到DOM树中，变成一颗渲染树，最终渲染到页面上。
