h5和css3新特性

H5 新特性？

1.拖拽释放（drap and drop）api ondrop,拖拽元素到浏览器的任意位置。这个其实是一系列事件（dragover,dragleave...）
2.自定义data-id,data-id只是行内存放数据的一个标签，跟input里面的value作用是一样的。获取数据的方法是
document.getElementById("test").dataset.id（id和data-id相对应）
3.语义化更好的标签（header,nav,footer,aside,article,section）
4.本地存储，h5提供了sessionStorage（浏览器关闭删除）、localStorage（长期存储,2.6）和indexedDB（内存250m）加强本地存储。
5.新事件：onresize、ondrag、onscroll、onmousewheel、onerror、onplay、onpause
6.canvas：canvas是一个基于 JavaScript 的绘图 API
7.新的技术，webworker（web worker 是运行在后台的 JavaScript，独立于其他脚本，不会影响页面的性能。）,websocket（web 通信）,geolocation（地理位置的应用）

css 新特性？

1.css选择器（渲染选择）

:last-child /* 选择元素最后一个孩子 */
:first-child /* 选择元素第一个孩子 */
:nth-child(1) /* 按照第几个孩子给它设置样式 */
:nth-child(even) /* 按照偶数 */
:nth-child(odd)  /* 按照奇数 */
:disabled /* 选择每个禁用的E元素 */
:checked /* 选择每个被选中的E元素 */
:not(selector) /* 选择非 selector 元素的每个元素 */
::selection /* 选择被用户选取的元素部分 */
a:link {color: #FF0000} /* 未访问的链接 */
a:visited {color: #00FF00} /* 已访问的链接 */
a:hover {color: #FF00FF} /* 鼠标移动到链接上 */
a:active {color: #0000FF} /* 选定的链接 */
::before {} /* 选择器在被选元素的前面插入内容和定义css，使用 content 属性来指定要插入的内容。 */
::after {} /* 选择器在被选元素的后面插入内容和定义css，使用 content 属性来指定要插入的内容。 */
:first-letter /* 选择该元素内容的首字母 */
:first-line /* 选择该元素内容的首行 */
::selection /* 选择被用户选取的元素部分 */

2.CSS 兼容内核

-moz-：代表FireFox浏览器私有属性
-ms-：代表IE浏览器私有属性
-webkit-：代表safari、chrome浏览器私有属性
-o-：代表opera浏览器私有属性

3.过渡 transition： CSS属性，花费时间，效果曲线(默认ease)，延迟时间(默认0)
4.动画 animation：动画名称，一个周期花费时间，运动曲线（默认ease），动画延迟（默认0），播放次数（默认1），是否反向播放动画（默认normal），是否暂停动画（默认running）
5.2d 3d转换