1. HTML、XML、XHTML 有什么区别
HTML被设计用来显示数据，焦点是数据的外观
XML被设计用来描述数据，焦点是数据的内容，并且标签没有自定义，全部需要自己定义
XHTML是居于可扩展标记语言的标记语言，也是HTML的一个子集，格式比HTML更加严谨
2. 怎样理解HTML的语义化
语义化是指根据内容的结构化（内容语义化），选择合适的标签（代码语义化），便于开发者阅读和写出更优雅的代码的同时，让浏览器的爬虫和机器很好的解析。
语义化的目的是
- 为了在没有CSS的情况下，页面也能呈现出很好地内容结构、代码结构（为了裸奔时好看）
- 提升用户体验：例如title、alt用于解释名词或解释图片信息、label标签的活用
- 有利于SEO「Search Engine Optimization」：和搜索引擎建立良好沟通，有助于爬虫抓取更多的有效信息：爬虫依赖于标签来确定上下文和各个关键字的权重
- 方便其他设备解析（如屏幕阅读器、盲人阅读器、移动设备）以有意义的方式来渲染网页；
- 便于团队开发和维护，语义化更具可读性，是下一步网页设计的重要动向，遵循W3C标准的团队都遵循这个标准，可以减少差异化。
如何语义化
- 尽可能少的使用无语义的标签div和span；
- 在语义不明显时，既可以使用div或者p时，尽量用p, 因为p在默认情况下有上下间距，对兼容特殊终端有利；
- 不要使用纯样式标签，如：b、font、u等，改用css设置。
- 需要强调的文本，可以包含在strong或者em标签中（浏览器预设样式，能用CSS指定就不用他们），strong默认样式是加粗（不要用b），em是斜体（不用i）；
- 使用表格时，标题要用caption，表头用thead，主体部分用tbody包围，尾部用tfoot包围。表头和一般单元格要区分开，表头用th，单元格用td；
- 表单域要用fieldset标签包起来，并用legend标签说明表单的用途；
- 每个input标签对应的说明文本都需要使用label标签，并且通过为input设置id属性，在lable标签中设置for=someld来让说明文本和相对应的input关联起来。
3. 怎样理解内容与样式分离的原则
指的的HTML上只应该设置内容与结构，不使设置具体样式
这样的做的好处是
- 利用CSS中的重用、组合、继承等特性减少样式的代码量，样式结构上非常清晰；
- 页面视觉有变动只需要修改相应的CSS文件，不用或者基本上不用改动html文档中的标签结构；
- 方便JavaScript脚本编写，比如用js控制标签的className来方便的、动态的改变元素的样式，而不是直接修改其具体样式
- 适合产品级、模块化的开发
- 提高可读性，方便后续维护、修改和替换
样式应该单独在CSS中设置，在html中引用
使用JavaScript的地方，同样应当如此
4. 有哪些常见的meta标签
meta的官方定义:
meta标签提供关于HTML文档的元数据。元数据不会显示在页面上，但是对于机器是可读的。它可用于浏览器（如何显示内容或重新加载页面），搜索引擎（关键词），或其他 web 服务。
<meta charset="utf-8">
申明编码，避免网页内的汉字变成乱码<meta name="Keyword" content="关键字">
描述网页关键字，用于搜索引擎搜索<meta name="Description" content="网页内容">
不超过150字，且能准确描述网页内容的标签<meta name="robots" content="index,flow">
robot terms是使用一组用","分开的值
1. all：文件将被检索，且页面上的链接可以被查询
2. none：文件将不被检索，且页面上的链接不可以被查询
3. index：文件将被检索
4. follow：页面上的链接可以被查询
5. noindex：文件将不被检索
6. nofollow：页面上的链接不可以被查询
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
根据不同设备，以及窗口大小调整内容<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
选择浏览器内核，优先选择chrome内核，如果不支持，则优先选择edge版的IE内核
5. 文档声明的作用?严格模式和混杂模式指什么?<!doctype html> 的作用?
web中有许多的文档类型，就算是html，也有不同的版本，所以需要文档开头说明文档类型，让浏览器能正确显示文档
<!doctype html> 处于<html>标签之前，告知浏览器以何种形式渲染文档严格排版模式会使浏览器用支持的最高web标准来解析页面，是一种严格要求的DTD(Document Type Definition)不允许使用任何表现层的标识和属性
混杂模式是一种向后兼容的解析方法，通常模拟老式浏览器的行为，以防止老站点无法工作
6.浏览器乱码的原因是什么？如何解决
- 造成浏览器乱码的主要是由于，html源代码中的文字内容与html编码不同造成的
- 加入<meta charset>编码标签规定好编码可以避免此种原因造成的乱码
7.常见的浏览器有哪些，什么内核
Trident内核 ： IE,MaxThon,TT,The World,360,搜狗浏览器等。[又称MSHTML]
Gecko内核 ： Netscape6及以上版本，FF,MozillaSuite/SeaMonkey等
Presto内核 ： Opera7及以上。 [Opera内核原为：Presto，现为：Blink;]
Webkit内核 ： Safari,Chrome等。 [ Chrome的：Blink（WebKit的分支）]
8.列出常见的标签，并简单介绍这些标签用在什么场景
<html> 开始标签
<head> 网页上的控制信息
<title> 页面标题 </title>
</head>
<body> 包括所有 页面显示的内容
<h1~6></h1~6> 页面标题，1~6重要程度依次递减
<p></p> 段落，前后若有其他，执行前后换行，并空开一行，保证自身是一个整体
<div></div> 层标签（默认占一行）
<span></span> 层标签（默认用多大空间占多大空间）
<ol> 有序列表
<li>内容</li>
<li>内容</li>
</ol>
<ul> 无序列表
<li>内容</li>
<li>内容</li>
</ul>
 图片标签，图片无法加载时会显示alt中文字
<a href="http://xxxx.com" target="_blank" title="xxx">xxx.com</a> 超链接
<dl> 用于展示一系列 “标题:内容... ”的场景
<dt>商品名称:</dt>
<dd>青花瓷</dd>
<dt>特征:</dt>
<dd>白色</dd>
<dd>圆口</dd>
<dt>商品介绍</dt>
<dd>这是一个年代久远的瓷器，很贵，易碎</dd>
</dl>
<button>点我</button> 按钮
<iframe src="http://jirengu.com" name="myPage"></iframe> 嵌入页面
</body>
</html> 结束标签
