携手创作，共同成长！这是我参与「掘金日新计划 · 8 月更文挑战」的第2天 二、HTML+CSS 面试题
1、HTML 面试题
1.1 如何理解 HTML 语义化？
- 让人更容易读懂（增加代码可读性）。
- 让搜索引擎更容易读懂，有助于爬虫抓取更多的有效信息，爬虫依赖于标签来确定上下文和各个关键字的权重（SEO）。
- 在没有 CSS 样式下，页面也能呈现出很好地内容结构、代码结构。
1.2 script 标签中 defer 和 async 的区别？
script：会阻碍 HTML 解析，只有下载好并执行完脚本才会继续解析 HTML。
async script：解析 HTML 过程中进行脚本的异步下载，下载成功立马执行，有可能会阻断 HTML 的解析。
defer script：完全不会阻碍 HTML 的解析，解析完成之后再按照顺序执行脚本。
下图清晰地展示了三种 script 的过程：
1.3 从浏览器地址栏输入 url 到请求返回发生了什么
1、HTTP 请求准备阶段
-
构建请求--浏览器构建请求行信息，准备发起网络请求 GET /index.html HTTP1.1
-
查找缓存--如果浏览器发现请问资源在浏览器中存在副本，根据强缓存规则，如没有过期那么直接返回资源，如何查找失败进入下一个环节：
--准备 ip 地址和端口\
--DNS（域名和ip的映射系统） 域名解析，拿到ip之后找端口，默认为80
--建立tcp链接（三次握手）
--如果是https 还需要建立TLS连接
2、HTTP 发送请求
浏览器向服务端发起http请求，把请求头和请求行一起发送个服务器，服务端解析请求头如发现cache-control和etag（if-none-match），if-modified（if-modified-since）字段就会判断缓存是否过期，如果没有返回304，否则返回200
3、HTTP 响应返回
- 浏览器拿到响应数据，首先判断是否是4XX或者5XX是就报错，如果是3XX就重定向，2XX就开始解析文件，如果是gzip就解压文件
- TCP断开连接
- 4次挥手
- 浏览器解析渲染
- 建立根据html建立dom树和css树，如果遇到script首选判断是否defer和async否则会阻塞渲染并编译执行js，如果没有则组合生成render tree，最后浏览器开启GPU进行绘制合成图层，将内容显示屏幕。
5、浏览器渲染页面
