HTML
1. html是什么
超文本标记语言，是一种创建网页标准的标记语言
2. HTML和XHML有什么区别
HTML是一种基于WEB网页设计的语言，XHTML是基于XML的标记语言
3. 简述一下你对HTML语义化的理解？
根据内容结构化，选择合适的标签代码语义化，可以更好的让浏览器和搜索引擎方便解析。为什么要语义化。可以在没有css的情况下更好的展示页面，提高用户体验，比如图片的title属性等，有利于SEO，方便开发者阅读
4. 浏览器页面有哪三层构成，分别是什么，作用是什么?
浏览器页面分为三层：结构层，表示层，行为层
分别对应：html，css，js
作用：html用于实现页面的结构，css用于描述页面的表现和样式风格，js用于页面的交互和业务逻辑的实现
5. Doctype作用？严格模式与混杂模式如何区分？
用户声明文档，告诉浏览器以什么文档标准去解析页面。
严格模式：又称一般模式，浏览器会以支持的最高模式进行去渲染文档，
混杂模式：以比较宽松向后兼容的模式，模拟老版本浏览器的行为，以防止站点无法运行。
什么情况会出现混杂模式，当Doctype不存在或者形式不正确都会导致混杂模式的出现
6.Quirks模式是什么？它和Standards模式有什么区别
在ie6之前如果没有声明DTD，浏览器就会向前兼容，采用兼容之前的布局方式，就是Quirks模式。
区别：
盒子模型：标准模式下盒子模型的width就是值width，height就是值height，在 quirks模式下，盒子的width也包含的padding和border
行内元素:标准模式下行内元素设置width，不生效，在quirks模式下就会生效
margin：0 auto标准模式下可以正常居中，但是在quirks模式下不生效
设置宽高百分比：在标准模式下；父元素的高是子元素的内容决定的，给父元素设置百分比高度之后子元素也设置百分比高度不生效，Quirks模式下就会生效
7.页面导入样式时，使用link和@import有什么区别？
- link标签除了可以加载css以外还可以定义RSS和ref连接属性，@import只能加载css
- 加载顺序：link标签在页面渲染的时候就可以加载，@import需要等页面渲染完成以后才能加载。
- 兼容问题：link是html标签没有兼容问题。@import是css2.1提出的需要ie以上的才能兼容
- js使用问题：link引入的css可以使用js去修改样式，而@import引入的不能进行修改
8.行内元素有哪些？块级元素有哪些？ 空(void)元素有那些？
行内元素：a b span select input lable
块级元素：div table p th tr td ol ul li h1-h6
空元素： br hr
9.介绍一下你对浏览器内核的理解？
主要分为：渲染引擎和js引擎
渲染引擎；主要负责抓取网页的内容html或xml和加入css进行页面渲染，以计算机网页的方式请输入到浏览器或者打印机，不同的浏览器的内核不一样渲染效果不一样。
js引擎：负责网页的交互和动画效果和执行业务代码
开始引擎区分的并不明确，js引擎越来越独立，后来内核倾向于渲染引擎了
10.常见的浏览器内核有哪些？
webkit：旧版chrome和safria常用，
Trident：又称IE内核，主要使用事IE再用，百度浏览器和一些兼容模式下的浏览器
presto：主要是Opera浏览器在使用，它是世界公认最快的渲染速度的引擎。但是在2013年以后Opera加入谷歌阵营弃用了 Presto
Blink: 由Google和Opera Software开发的浏览器排版引擎 使用代表 ：chrome和Opera
Gecko: 使用代表火狐Firefox
11.title与h1的区别、b与strong的区别、i与em的区别？
title和h1的区别
title是网页的标题，显示在浏览器tab栏里面的，直接告诉搜索引擎和用户这个网站的主题
h1是文章的标题，显示在网页里的，面向用户，告诉用户这个文章的主题。
b和strong的区别
b：实体标签，用于给文字加粗
strong：逻辑标签，用于加强文字语气
区别：
b标签没有实体意义，只是给文字加粗效果，
strong：有文字强调语气，默认也是文字加粗的提示，也可以使用css进行其他样式的强调。
建议：为了符合CSS3的规范，b应尽量少用而改用strong
i和em的区别
i：实体标签，使字体倾斜
em：逻辑标签,强调文字作用
区别：
i标没实际意义，让字体倾斜，
em，强调文字作用，默认倾斜状态。可以使用css修改默认强调样式
12.iframe有那些缺点？
阻止页面onload事件，
不利于SEO，设备兼容性差
iframe和主页共享链接池，浏览器对相同的连接数有限制，所以会影响页面并行加载。（解决办法就是动态的修改iframe的src，等主页面加载好以后动态赋值，再去加载）
iframe会增加http请求，大型网站不可取
13.页面可见性（Page Visibility API） 可以有哪些用途？
document.visibilityState
有三个状态
visible
页面内容可以至少部分可见。实际上，这意味着页面是非最小化窗口的前景选项卡。
hidden：
页面内容对用户不可见。实际上，这意味着该文档是背景选项卡或最小化窗口的一部分，或者操作系统屏幕锁定处于活动状态。
document.addEventListener("visibilitychange", function() {
console.log( document.visibilityState );
})
可以知道页面是不是处于后台状态或者设备锁屏状态，或者最小化状态，浏览器打开多个页面不在当前页面的时候。
14.实现不使用 border 画出1px高的线，在不同浏览器的Quirksmode和CSSCompat模式下都能保持同一效果。
<div style="width: 100%;height: 1px;"></div>
HTML5
1.html5有哪些新特性、移除了那些元素？如何处理HTML5新标签的浏览器兼容问题？如何区分 HTML 和 HTML5？
HTML5新增特性
1.语义化标签：header。 footer。nav。section。article
2.绘图：canvas
3.媒体回放：video audio
4.地理地位：Geolocation（地理定位）
5.本地存储：localStorage .sessionStorage
6.表单控件： calendar、date、time、email、url、search 等
移除了
big。center。font。frame。applet。等标签
兼容性
最新版本的 Safari、Chrome、Firefox 以及 Opera 支持某些 HTML5 特性。Internet Explorer 9 将支持某些 HTML5 特性。
处理浏览器兼容问题
（1）、使用document创建标签
使用标签判断IE9的加载html的js。在ie6的加载letskillie6.zh_CN.pack.js
（2）使用html5shim：在中调用以下代码：
1.<!--[if lt IE 9]>
2.<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
3.<![endif]-->
b）使用kill IE6: 在</body>之前调用以下代码：
1.<!--[if lte IE 6]>
2.<script src="http://letskillie6.googlecode.com/svn/trunk/letskillie6.zh_CN.pack.js"></script>
3.<![endif]-->
区分html5
<!doctype> 声明必须位于 HTML5 文档中的第一行，html的声明比较长。
后续更新---------