这是我参与「第五届青训营 」伴学笔记创作活动的第 1 天。
今天看了学习资料中的HTML和CSS上下的课程，感觉有所收获。HTML5 新的特性中扩展了比较多的标签，例如：header、nva、section、aside、footer等等，这些新的标签方便了一些布局效果的实现。当然H5并不仅仅只是扩展了标签，也增加了一些新的特性，我看了一些资料，有以下总结。
H5的新特性：
①语义标签、②增强型表单、③视频和音频、④Canvas绘图、⑤SVG绘图、⑥地理位置、⑦拖放api、⑧WebWorker、⑨WebStorage、⑩WebSocket。
H5新特性功能简介
①和②都是新增的标签。举例：nav、section、 <input type="file" id="file"> 表单的placeholder属性 。
③视频&音频：增加了标签可以直接引入视频和音频的资源从而呈现在页面上,举例：<video src="./1.mp4"></video>
<audio controls>
<source src="./1.mp3">
</audio>
④ Canvas绘图：通过使用canvas标签这部分的内容比较少，主要是在js中绘制自己需要的图形；
⑤SVG：这个是绘制2d图形的表签，主要是通过一个一个坐标将对应的图形绘制出来，阿里矢量图就可以通过使用svg表签的形式直接引入到HTML中；
⑥地理位置：可以获取到当期位置；⑦拖放API：可以对元素进行拖放，主要是通过js实现；
⑧WebWorker:WebWorker是运行在后台的JavaScript独立于其他的脚本，因为js 的执行方式是单线程的形式，当前面的事情没有执行完成后是不会继续执行接下来的程序，可以通过，有新特性后主线程可以创建子进程，子进程完成后可以将返回的结果传递给主线程，这样可以提高效率,不过WebWorker也是存在限制的；
⑨WebStorage:WebStorage主要是用于对于数据的存储。相较于HTML4的cookie在用户端保存用户数据，WebStorage在客户端本地存储用户的数据，每次发送请求时不必将数据连同HTTP事务一起发送，存储的分类有下 localStorage和 sessionStorage， 两者都有“同源策略”，但是前者是永久保存，除非用户手动式删除，后者是临时存储
⑩WebSocket:这个主要的作用是在服务器端与用户端建立一个双向的连接，更具体的涉及到网络相关的知识了。更多关于WebSocket的知识：HTML5 十大新特性(十)——Web Socket - fjy2016 - 博客园 (cnblogs.com)
