简答题
1.简述HTML与HTML5的区别。
取消了一些过时的HTML4标记，如包含显示效果的标记等，已经被CSS所取代，++、 等标记则被完全的去掉了。除此之外，在HTML5中加入了大量的新标记，如++
、 、 、 、 等，以便在制作网页时使用新标记进行全新的布局设计。
加入了全新的表单输入对象，例如、、、等标记，进行新的表单控件开发。
强化了Web页面的表现性，增加了本地数据库特性。HTML5支持语义化标记，支持网页中的多媒体属性，并引入了新的音频标记audio和视频标记video。在数据存储中对本地离线存储有了更好的支持。
引入Canvas画布的概念，通过使用Canvas画布和SVG技术实现在网页中二维图形的绘制。
用户无需安装插件，HTML5取代Flash在移动设备的地位。
采用了开放的标准与技术，加强了浏览器中的异常处理。
2.简述HTML5的新特性。
强化了网页的表现功能，对网页中的音频，视频，动画等标签有了更多的支持。
增加了网页对移动端的处理能力，对手机端的触摸与移动功能支持力度加大，并改善了本地数据库等网页功能，包含信息存储，本地定位等。
3.简述HTML5新的布局标签。
：页面标题区域，用于表示区域内的个体标题，可用在整个文档中，也可以在局部使用。 ：页面导航区域，专门放置网页中菜单导航和链接导航的区域。 与 ：页面主内容区域，网页中的主要内容部分，用于放置网页的主要内容，也可以嵌套放置其它标记。 ：页面侧内容区域，与section相似，也用于放置网页内容。
：页面页脚区域，网页最底部的区域，用于放置作者信息、用户导航、联系方式以及广告插入等内容。
4.简述响应式布局的含义。
响应式布局的实质就是让用户可以使用各种不同的设备浏览网站都能得到较好的视觉效果的方法。简而言之是指在Web中的网页能自动识别屏幕宽度、并做出相应调整的网站设计。在实际设计中，主要使用HTML5与CSS3相结合的方式来完成整个页面的制作。
5.简述框模型的含义。
在框模型中，网页元素在最中间，外面是pading，称为内边距或填充；再外面是margin，称为外边距或空白区域。内边距和外边距都是可选的，默认值为零，可以在样式表的最开始进行设置：
6.简述CSS的定位设置。
使用position:relative可以将元素设置为相对定位，从而控制元素在常规流中的堆叠顺序。设置为相对定位的元素将会偏离某个距离，元素会保持其未定位前的形状，它原来占据的空间会保留。
使用position:absolute可以精确的控制绝对定位元素与祖先元素的位置，设置为绝对定位的元素从文档流中删除，不再占用原有的空间。绝对定位"相对于"该元素最近的已经定位的祖先元素，如果不存在祖先元素，则将作为最近定位的祖先元素。
7.简述CSS中超链接的设置。
在CSS中可以设置超链接的各种属性，常见的有字体、颜色、背景、下划线以及伪类。超链接常见伪类如下所示：
a:link 表示超链接样式
a:hover表示当鼠标经过超链接样式
a:active 表示点击超链接样式
a:visited表示已访问过的超链接样式
8.简述audio的"none"、"auto"、"metadata"属性异同。
"none": 这个值指的是用户不需要对音频进行预先加载，这样可以减少网络流量，一个典型的情景就是一个具备背景播放的语音播客中，每一篇文章其实都有音频，但只有当用户确认打开这些音频收听时，才通过网络进行加载。否则，这么多数量的音频同时进行预加载，速度是很慢的。
"metadata": 这个选项的值将告诉服务端，用户不想马上加载音频，但需要预先获得音频的元数据信息(比如文件的大小，时长等)。如果开发者是在设计音频播放器或者需要获得音频的信息而不需要马上播放视频，则可以使用这个选项。
"auto":这个选项告诉服务端，用户需要马上加载音频并进行流式播放，这在比如一些游戏场景等需要实时音频的场景中会用到。
9.简述三种audio标签的使用方法。
(1) <audio src="audio/sample.mp3"autoplay>
(2)var audio=document.createElement("audio");
if(audio !=null&&audio.canPlayType&&audio.canPlayType("audio/mpeg"))
{
audio.src="audio/sample.mp3";
audio.play();
}
(3) <audio src="data:audio/mpeg,ID3%02%00%00%00%00%..."autoplay>
10.简述video的使用方法。
在HTML5中使用标签描述视频文件。基本语法如下：
浏览器不支持该标签。
11.简述Canvas画布的特点。
使用Canvas元素可以在HTML5网页中绘制各种形状，处理图像信息，制作动画等。值得注意的是Canvas元素只是在网页中创建了图像容器，必须要使用Javascript语言来书写脚本以绘制对应的图形.
12.简述Canvas画布绘制圆的方法。
在HTML5中，绘制曲线使用方法如下：
arc(x, y, radius, startRad, endRad, anticlockwise)，arc用于绘制一个以（x，y）为圆心，radius为半径，startRad为起始弧度，endRad为结束弧度的圆弧。在这里以anticlockwise来表示该圆弧是顺时针还是逆时针，如果为true表示为逆时针，false则表示为顺时针。
13.简述SVG的特点。
SVG(可伸缩矢量图形)是用于描述二维矢量图形的一种图形格式，它由万维网联盟制定，是一种基于XML语言的开放性标准。因此SVG是一种XML文件，在互联网上被广泛的用来创建和修改图像。目前也比较成熟的应用于智能手机中，支持用户查看高质量的图像和动画。在实现中，SVG严格遵循XML语法，用文本格式的方式来描述图像信息
14.简述SVG中path绘图的参数。
path元素支持的指令有：
M = moveto(M X,Y) ：将画笔移动到指定的坐标位置
L = lineto(L X,Y) ：画直线到指定的坐标位置
H = horizontal lineto(H X)：画水平线到指定的X坐标位置
V = vertical lineto(V Y)：画垂直线到指定的Y坐标位置
C = curveto(C X1,Y1,X2,Y2,ENDX,ENDY)：三次贝赛曲线
S = smooth curveto(S X2,Y2,ENDX,ENDY)
Q = quadratic Belzier curve(Q X,Y,ENDX,ENDY)：二次贝赛曲线
T = smooth quadratic Belzier curveto(T ENDX,ENDY)：映射
A = elliptical Arc(A RX,RY,XROTATION,FLAG1,FLAG2,X,Y)：弧线
Z = closepath()：关闭路径
15.拖动元素所触发的MOUSE事件主要包括哪些方面？
DataTransfer对象：拖拽对象用来传递的媒介，使用一般为Event.dataTransfer。
draggable属性：就是标签元素要设置draggable=true，否则不会有效果。
ondragstart事件：当拖拽元素开始被拖拽的时候触发的事件，此事件作用在被拖曳元素上
ondragenter事件：当拖拽元素进入目标元素的时候触发的事件，此事件作用在目标元素上
ondragover事件：拖拽元素在目标元素上移动的时候触发的事件，此事件作用在目标元素上
ondrop事件：被拖拽的元素在目标元素上同时鼠标放开触发的事件，此事件作用在目标元素上
ondragend事件：当拖拽完成后触发的事件，此事件作用在被拖曳元素上
Event.preventDefault()方法：阻止默认的事件方法等执行。在ondragover中一定要执行preventDefault()，否则ondrop事件不会被触发。另外，如果是从其他应用软件或是文件中拖东西进来，尤其是图片的时候，默认的动作是显示这个图片或是相关信息，并不是真的执行drop，此时需要用document的ondragover事件来执行。
Event.effectAllowed属性：就是拖拽的效果。
16.如何阻止默认事件的触发，需在ondragover触发时如何控制？
Event.preventDefault()方法：阻止默认的事件方法等执行。在ondragover中一定要执行preventDefault()，否则ondrop事件不会被触发。
17.自己动手做一个简单的图片拖动的程序，并熟悉dragstart->dragenter->dragover-> drop ->dragend的整个过程。
<script>
function allowDrop(ev)
{
ev.preventDefault();
}
function drag(ev)
{
ev.dataTransfer.setData("Text",ev.target.iD;
}
function drop(ev)
{
ev.preventDefault();
var data=ev.dataTransfer.getData("Text");
ev.target.appendChild(document.getElementById(datA);
}
</script>拖动元素所触发的MOUSE事件主要包括哪些方面。
DataTransfer 对象：拖拽对象用来传递的媒介，使用一般为Event.dataTransfer。
draggable 属性：就是标签元素要设置draggable=true，否则不会有效果。
ondragstart 事件：当拖拽元素开始被拖拽的时候触发的事件，此事件作用在被拖曳元素上
ondragenter 事件：当拖拽元素进入目标元素的时候触发的事件，此事件作用在目标元素上
ondragover 事件：拖拽元素在目标元素上移动的时候触发的事件，此事件作用在目标元素上
ondrop 事件：被拖拽的元素在目标元素上同时鼠标放开触发的事件，此事件作用在目标元素上
ondragend 事件：当拖拽完成后触发的事件，此事件作用在被拖曳元素上
Event.preventDefault() 方法：阻止默认的事件方法等执行。在ondragover中一定要执行preventDefault()，否则ondrop事件不会被触发。另外，如果是从其他应用软件或是文件中拖东西进来，尤其是图片的时候，默认的动作是显示这个图片或是相关信息，并不是真的执行drop，此时需要用document的ondragover事件来执行。
Event.effectAllowed 属性：就是拖拽的效果。