1.HTML、XML、XHTML 有什么区别?
从字面上看，他们都是HTML，都是标记语言（Markup Language）
HTML，超文本标记语言，是语法较为松散的、不严格的Web语言；
XML，可扩展标记语言，主要用于存储数据和结构，可扩展参考；
XHTML，可扩展超文本标记语言，基于XML，作用与HTML类似，但语法更严格参考。
2.怎样理解 HTML 语义化?
简单说语义化就是让机器可以好的读懂内容。对于当前的 Web 而言，HTML 是联系大多数 Web 资源的纽带。随着互联网的发展，WEB承载越来越多的信息（图片，声音，视频等），人们开始用机器来处理网络信息，就此诞生了搜索引擎。如次庞大及复杂的信息如何让搜索引擎处理和挖掘，所以让机器能够更好地读懂WEB上内容就变得越来越重要。
Web语义化有三个阶段:
- 浏览器和W3C组织推出的如h1~h6、thead、ul、ol的HTML标签，用于在Web页面中组织对应的内容，如网页标题、表头、无序、有序列表，以达到更方便的协作及传播互联网内容。搜索引擎很好的利用了这些语义化标签抓取内容，又鉴于搜索引擎的巨大流量推荐，Web前端不得不考虑SEO，从而两者实现有益的循环，共同推进着语义化标签的使用。
- 但Web的发展超乎想象，起初定义的HTML语义化标签，不足以实现对Web页面各个部分的功能或位置描述，所以Web前端人员利用HTML标签的id和class属性，进一步对HTML标签进行描述，如对页脚HTML标签添加如id="footer"或者class="footer"的属性（值），以“无声”的方式在不同的前端程序员或者前后端程序员间实现交流。
- W3C组织意识到了之前HTML版本的不足，推出的HTML5进一步推进了Web语义化发展，采用了诸如footer、section等语义化标签，弥补了采用id="footer"或者class="footer"形式的不足，以更好的推动Web的发展。
语义化可以带来的好处：
- 清晰的页面结构：去掉或样式丢失的时候，也能让页面呈现清晰的结构，增强页面的可读性。
- 支持更多的设备：屏幕阅读器（如果访客有视障）会完全根据你的标记来“读”你的网页。 如果你使用的含语义的标记，屏幕阅读器会根据你的标签来判断网页的内容，而不是一个字母一个字母的拼写出来。
- 有利于SEO：和搜索引擎建立良好沟通，有助于爬虫抓取更多的有效信息，搜索引擎的爬虫也依赖于标记来确定上下文和各个关键字的权重。
- 便于团队开发和维护：在团队中大家都遵循同一个标准，可以减少很多差异化的东西，方便开发和维 护，提高开发效率，甚至实现模块化开发。
3.怎样理解内容与样式分离的原则？
在前端中，Html指的是结构层；CSS指的是样式层；JavaScript指的是行为层。
写 HTML 的时候先不管样式, 重点放在HTML的结构和语义化上，让 HTML 能体现页面结构或者内容之后再去写样式。
HTML 内不允许出现属性样式，尽量不要出现行内样式。
写 JS 的时候，尽量不要用 JS 去直接操作样式，而是通过给元素添加删除class来控制样式变化。
4.有哪些常见的meta标签?
| 标签 | 含义 |
|---|---|
| <mata charset="utf-8"> | 声明文档使用的字符编码 |
| <meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1"/> | 声明文档兼容模式，指示IE以 目前 可用的最高模式显示内容 |
| <meta name="keywords" content="your tags"> | 定义针对搜索引擎的关键词 |
| <meta name="description" content="不超过850个字符"> | 页面描述，告诉搜索引擎你的站点的主要内 容 |
| <meta name="author" content="你的姓名"> | 定义网页作者 |
| <meta name="revised" content="David, 2008/8/8/" /> | 定义页面的最新版本 |
| <meta http-equiv="refresh" content="5"/> | 5秒刷新一次页面 |
| <meta http-equiv="expires" content="Mon,12 May 2001 00:20:00 GMT"> | 用于设定网页的到期时间，一旦过期则必须到服务器上重新调用。需要注意的是必须使用GMT时间格式 |
| <meta http-equiv="pragma" content="no-cache"> | 禁用缓存 |
| <meta http-equiv="set-cookie" content="Mon, 12 May 2001 00:20:00 GMT"> | cookie设定，如果网页过 期，存盘的cookie将被删除。需要注意的也必须使用GMT时间格式。 |
| <meta name="robots" content="index,follow" /> | 搜索引擎索引方式 |
5.文档声明的作用?严格模式和混杂模式指什么?<!doctype html>
- <!DICTYPE>声明位于文档中的最前面，处于<html>标签之前，告诉浏览器的解析器，用什么文档类型来规范解析这个文档。
- 严格模式的排版和js运作模式是以该浏览器支持的最高标准运行
- 在混杂模式中，页面以宽松的向后兼容的方式显示，模拟老式浏览器的行为以防止站点无法工作
DOCTYPE不存在 或格式不正确会导致文档以混杂模式呈现
6.浏览器乱码的原因是什么？如何解决
设置<meta charset>标签声明文档使用的字符编码
设置正确的字符编码
设置浏览器显示正确的编码
如果浏览器浏览时候出现网页乱码，在浏览器中找到转换编码的菜单调整。IE9浏览器：在需要转码的网页空白出右键鼠标，选择“编码”。傲游浏览器：在需要转码的网页时，菜单“查看”-->“编码”即可选择转换编码谷歌浏览器：在需要转码的网页时，点击右上角“三横”图标选择“工具”-->“编码”即可选择切换网页编码
7.常见的浏览器有哪些，什么内核?
| 浏览器 | 内核 |
|---|---|
| IE | Trident又称IE内核 |
| Firefox | Gecko |
| Opear | Presto |
| Safari | Webkit |
| chrome | Webkit |
8.列出常见的标签，并简单介绍这些标签用在什么场景
| 标签 | 场景 |
|---|---|
| html | 将所有HTML内容都包含在这个标签内 |
| head | 用于定义文档的头部，它是所有头部元素的容器 |
| title | 文档的标题 |
| meta | 提供有关页面的元信息 |
| body | 文档的内容 |
| h1-h6 | h1h6分别对应六级标题，从16标题一次减小 |
| p | 段落标签 |
| a | 定义锚，即在页面插入链接 |
| img | 图片 |
| ul | 无序列表 |
| ol | 有序列表 |
| li | 列表项 |
| div | 定义文档中的节，默认表现为块元素 |
| span | 定义定义文档中的节，默认表现为行内元素 |
| em | 定义强调文本 |
| br | 换行 |
| i | 定义斜体字 |
| strong | 定义强调文本 |
| q | 定义短引用 |
