一
1.HTML5有哪些新特性？如何处理HTML5新标签的浏览器兼容问题？如何区分HTML和HTML5？
(Q1)
HTML5 现在已经不是 SGML 的子集，主要是关于图像，位置，存储，多任务等功能的增加。
(1)绘画 canvas;
(2)用于媒介回放的 video 和 audio 元素;
(3)本地离线存储 localStorage 长期存储数据，浏览器关闭后数据不丢失;
(4)sessionStorage 的数据在浏览器关闭后自动删除;
(5)语意化更好的内容元素，比如 article、footer、header、nav、section;
(6)表单控件，calendar、date、time、email、url、search;
(7)新的技术webworker, websocket, Geolocation;
(Q2)
IE8/IE7/IE6支持通过document.createElement方法产生的标签，
可以利用这一特性让这些浏览器支持HTML5新标签，
浏览器支持新标签后，还需要添加标签默认的样式。
当然也可以直接使用成熟的框架、比如html5shim;
1、在文档类型声明上
HTML声明：
HTML5声明：
上面的两种声明,HTML5声明简洁方便人们的记忆，HTML声明太长了并且很难记住这段代码。
2、在结构语义上
HTML:没有体现结构语义化的标签，通常都是这样来命名的
，这样表示网站的头部。HTML5:在语义上却有很大的优势，提供了一些新的HTML5标签比如: article、footer、header、nav、section，这些通俗易懂。
2.css3中的transform有哪些属性？分别用来实现什么效果？
1 transform属性
在CSS3中，可以利用transform功能实现文字或图像的旋转、缩放、倾斜、移动这4中类型的变形处理。
（1）浏览器支持
到目前为止：Safari3.1以上、Chrome8以上、Firefox4以上、Opera10以上浏览器支持该属性。
2 旋转
使用rotate方法，在参数中加入角度值，角度值后面跟表示角度单位的“deg”文字即可，旋转方向为顺时针方向。
transform：rotate（45deg）；
3 缩放
使用scale方法来实现文字或图像的缩放处理，在参数中指定缩放倍率。
transform：scale（0.5）；//缩小一半
（1）可以分别指定元素的水平方向的放大倍率与垂直方向的放大倍率
transform：scale（0.5，2）；//水平方向缩小一半，垂直方向放大一倍。
4 倾斜
使用skew方法实现文字或图像的倾斜处理，在参数中分别指定水平方向上的倾斜角度与垂直方向上的倾斜角度。
transform：skew（30deg，30deg）；//水平方向上倾斜30度，垂直方向上倾斜30度。
（1）只使用一个参数，省略另一个参数
这种情况下视为只在水平方向上进行倾斜，垂直方向上不倾斜。
transform：skew（30deg）；
5 移动
使用translate方法来移动文字或图像，在参数中分别指定水平方向上的移动距离与垂直方向上的移动距离。
transform：translate（50px，50px）；// 水平方向上移动50px，垂直方向上移动50px
（1）只使用一个参数，省略另一个参数
这种情况下视为只在水平方向上移动，垂直方向上不移动。
transform：translate（50px）；
6 对一个元素使用多种变形的方法
transform：translate（150px，200px） rotate（45deg） scale（1.5）；
7 指定变形的基准点
在使用transform方法进行文字或图像变形的时候，是以元素的中心点为基准点进行变形的。
transform-origin属性
使用该属性，可以改变变形的基准点。
transform：rotate（45deg）；
transform-origin：left bottom；//把基准点修改为元素的左下角
（1）指定属性值
基准点在元素水平方向上的位置：left、center、right
基准点在元素垂直方向上的位置：top、center、bottom
8 3D变形功能
（1）旋转
分别使用rotateX方法、rotateY方法、rotateZ方法使元素围绕X轴、Y轴、Z轴旋转，在参数中加入角度值，角度值后面跟表示角度单位的deg文字即可，旋转方向为顺时针旋转。
transform：rotateX（45deg）；
transform：rotateY（45deg）；
transform：rotateZ（45deg）；
transform：rotateX（45deg） rotateY（45deg） rotateZ（45deg）；
transform：scale（0.5） rotateY（45deg） rotateZ（45deg）；
（2）缩放
分别使用scaleX方法、scaleY方法、scaleZ方法使元素按X轴、Y轴、Z轴进行缩放，在参数中指定缩放倍率。
transform：scaleX（0.5）；
transform：scaleY（1）；
transform：scaleZ（2）；
transform：scaleX（0.5）scaleY（1）；
transform：scale（0.5） rotateY（45deg）；
（3）倾斜
分别使用skewX方法、skewY方法使元素在X轴、Y轴上进行顺时针方向倾斜（无skewZ方法），在参数中指定倾斜的角度
transform：skewX（45deg）；
transform：skewY（45deg）；
（4）移动
分别使用translateX方法、translateY方法、translateZ方法、使元素在X轴、Y轴、Z轴方向上进行移动，在参数中加入移动距离。
transform：translateX（50px）;
transform：translateY（50px）;
transform：translateZ（50px）;
9 变形矩阵
每种变形方法的背后都存在着一个对应的矩阵。
（1）计算2D变形（3 X 3矩阵）
可以将这个2D变形矩阵书写为matrim（a,b,c,d,e,f）,a~f均代表一个数字，用于决定怎样执行变形处理。
（2）平移的2D矩阵
//效果一致：右移150px，下移150px
transform：matrix（1，0,0,1，150，150）；
transform：translate（150px，150px）；
（3）计算3D变形
3D缩放变形使用的4X4矩阵
transform:matrix3d(sx,0,0,0,0,sy,0,0,0,0,sz,0,0,0,0,1);
//效果一致：X轴方向上缩小五分之一，Y轴方向上缩小一半。
transform:scale3d(0.8,0.5,1);
transform:matrix3d(0.8,0,0,0,0,0.5,0,0,0,0,1,0,0,0,0,1);
（4）可通过矩阵执行多重变形处理
将需要的变形矩阵相乘得到一个新的变形矩阵可实现该处理。
3.localStorage、sessionStorage、cookie有什么区别？
1、概述
sessionStorage 和 localStorage 是HTML5 Web Storage API 提供的，可以方便的在web请求之 间保存数据。
sessionStorage、localStorage、cookie都是在浏览器端存储的数据。
2、共同点
都是保存在浏览器端，且同源的。
3、区别
传递方式：
cookie在浏览器和服务器间来回传递；
sessionStorage和localStorage不会自动把数据发给服务器，仅在本地保存；
存储大小：
localStorage<=5M；
sessionStorage<=5M；
cookie<4K；（ie内核浏览器占主流地位，且ie6仍占有相当大的市场份额，所以在程序中应当使用少于20个cookie，且不大于4k）
有效性：
localStorage：始终有效，窗口或浏览器关闭也一直保存，因此用作持久数据；
sessionStorage：仅在当前浏览器窗口关闭前有效，不能持久保持；
cookie：只在设置的cookie过期时间之前一直有效，即使窗口或浏览器关闭也不会消失；
共享机制：
localStorage ：在所有同源窗口中都是共享的；
sessionStorage：同时“独立”打开的不同窗口，即使是同一页面，sessionStorage对象也是不同的；
cookie：在所有同源窗口中都是共享的
浏览器支持：
sessionStorage的浏览器最小版本：IE8、Chrome 5。
使用场景
cookie：保存回话信息
localStorage：持久保存的数据
sessionStorage：拥有独立特性的数据