来源 | https://github.com/CavsZhouyou/Front-End-Interview-Notebook/blob/master/Html/Html.md
1、 DOCTYPE 的作用是什么？
相关知识点：
回答（参考1-5）：
2、标准模式与兼容模式各有什么区别？
3、HTML5 为什么只需要写 <!DOCTYPE HTML>，而不需要引入 DTD？
4、SGML 、 HTML 、XML 和 XHTML 的区别？
5、 DTD 介绍
6、行内元素定义
7、块级元素定义
8、行内元素与块级元素的区别？
9、HTML5 元素的分类
10、空元素定义
11、link 标签定义
12、页面导入样式时，使用 link 和 @import 有什么区别？
13、你对浏览器的理解？
14、 介绍一下你对浏览器内核的理解？
15、常见的浏览器内核比较
详细的资料可以参考： 《浏览器内核的解析和对比》 《五大主流浏览器内核的源起以及国内各大浏览器内核总结》
16、常见浏览器所用内核
17、浏览器的渲染原理？
详细资料可以参考： 《浏览器渲染原理》 《浏览器的渲染原理简介》 《前端必读：浏览器内部工作原理》 《深入浅出浏览器渲染原理》
18、 渲染过程中遇到 JS 文件怎么处理？（浏览器解析过程）
19、async 和 defer 的作用是什么？有什么区别？（浏览器解析过程）
详细资料可以参考： 《defer 和 async 的区别》
20、什么是文档的预解析？（浏览器解析过程）
21、 CSS 如何阻塞文档解析？（浏览器解析过程）
22、渲染页面时常见哪些不良现象？（浏览器渲染过程）
详细资料可以参考： 《前端魔法堂：解秘 FOUC》 《白屏问题和 FOUC》
23、如何优化关键渲染路径？（浏览器渲染过程）
详细资料可以参考： 《优化关键渲染路径》
24、什么是重绘和回流？（浏览器绘制过程）
详细资料可以参考： 《浏览器的回流与重绘》
25、如何减少回流？（浏览器绘制过程）
26、为什么操作 DOM 慢？（浏览器绘制过程）
27. DOMContentLoaded 事件和 Load 事件的区别？
详细资料可以参考： 《DOMContentLoaded 事件 和 Load 事件的区别？》
28、HTML5 有哪些新特性、移除了那些元素？
29、 如何处理 HTML5 新标签的浏览器兼容问题？
30、简述一下你对 HTML 语义化的理解？
相关知识点：
回答：
详细资料可以参考： 《语义化的 HTML 结构到底有什么好处？》 《如何理解 Web 语义化？》 《我的 HTML 会说话——从实用出发，谈谈 HTML 的语义化》
31、 b 与 strong 的区别和 i 与 em 的区别？
详细资料可以参考： 《HTML5 中的 b/strong，i/em 有什么区别？》
32、前端需要注意哪些 SEO ？
33、HTML5 的离线储存怎么使用，工作原理能不能解释一下？
详细的使用可以参考： 《HTML5 离线缓存-manifest 简介》 《有趣的 HTML5：离线存储》
34、 浏览器是怎么对 HTML5 的离线储存资源进行管理和加载的呢？
35、常见的浏览器端的存储技术有哪些？
详细的资料可以参考： 《很全很全的前端本地存储讲解》
36、请描述一下 cookies，sessionStorage 和 localStorage 的区别？
相关资料：
回答：
详细的资料可以参考： 《请描述一下 cookies，sessionStorage 和 localStorage 的区别？》 《浏览器数据库 IndexedDB 入门教程》
37、iframe 有那些缺点？
详细的资料可以参考： 《使用 iframe 的优缺点》 《iframe 简单探索以及 iframe 跨域处理》
38、Label 的作用是什么？是怎么用的？
39、HTML5 的 form 的自动完成功能是什么？
40、如何实现浏览器内多个标签页之间的通信?
相关资料：
回答：
详细的资料可以参考：
《WebSocket 教程》 《WebSocket 协议：5分钟从入门到精通》 《WebSocket 学习（一）——基于 socket.io 实现简单多人聊天室》 《使用 Web Storage API》 《JavaScript 的多线程，Worker 和 SharedWorker》 《实现多个标签页之间通信的几种方法》
41、 webSocket 如何兼容低版本浏览器？
42、页面可见性（Page Visibility API） 可以有哪些用途？
详细资料可以参考： 《Page Visibility API 教程》
43、 如何在页面上实现一个圆形的可点击区域？
详细资料可以参考： 《如何在页面上实现一个圆形的可点击区域？》 《HTML 标签及在实际开发中的应用》
44、 实现不使用 border 画出 1 px 高的线，在不同浏览器的标准模式与怪异模式下都能保持一致的效果。
45、 title 与 h1 的区别？
46、<img> 的 title 和 alt 有什么区别？
47、Canvas 和 SVG 有什么区别？
详细资料可以参考： 《SVG 与 HTML5 的 canvas 各有什么优点，哪个更有前途？》
48、网页验证码是干嘛的，是为了解决什么安全问题？
49、渐进增强和优雅降级的定义
50、attribute 和 property 的区别是什么？
51. 对 web 标准、可用性、可访问性的理解
52、IE 各版本和 Chrome 可以并行下载多少个资源？
53、Flash、Ajax 各自的优缺点，在使用中如何取舍？
54、怎么重构页面？
55、 浏览器架构
56、常用的 meta 标签
详细资料可以参考： 《Meta 标签用法大全》
57、 css reset 和 normalize.css 有什么区别？
相关知识点：
回答：
详细资料可以参考： 《关于CSS Reset 那些事（一）之 历史演变与 Normalize.css》 《Normalize.css 和 Reset CSS 有什么本质区别没？》
58、用于预格式化文本的标签是？
59、DHTML 是什么？
60、head 标签中必不少的是？
61、HTML5 新增的表单元素有？
62、在 HTML5 中，哪个方法用于获得用户的当前位置？
63、 文档的不同注释方式？
64、disabled 和 readonly 的区别？
65、主流浏览器内核私有属性 css 前缀？
66、前端性能优化？
详细的资料可以参考： 《前端性能优化之雅虎35条军规》 《你真的了解 gzip 吗？》 《前端性能优化之 gzip》
67、Chrome 中的 Waterfall ？
详细资料可以参考： 《前端性能之 Chrome 的 Waterfall》 《教你读懂网络请求的瀑布图》 《前端妹子跟我抱怨她们的页面加载很慢的时候，如何在她面前优雅地装逼？》
68、扫描二维码登录网页是什么原理，前后两个事件是如何联系的？
详细资料可以参考： 《微信扫描二维码登录网页》
69、Html 规范中为什么要求引用资源不加协议头或者？