HTML5和CSS3新特性有哪些

HTML5
(1)问题分析

对于目前市场上来说HTML5中需要掌握的新特性有:
1.拖拽释放(Drag and drop) API
2.语义化更好的内容标签(header,nav,footer,aside,article,section)
3.音频、视频API(audio,video)
4.画布(Canvas) API
5.地理(Geolocation) API
6.本地离线存储 localStorage 长期存储数据,浏览器关闭后数据不丢失;
7.sessionStorage 的数据在浏览器关闭后自动删除
8.表单控件,calendar、date、time、email、url、search
9.新的技术webworker, websocket, Geolocation
其中画布和地理api,本地存储用的比较的多。
(2)核心问题讲解
语义化标签,例如,多媒体就是可以添加视频元素。
Canvas、svg,是实现前端数据可视化必不可少的东西。
离线存储:用于优化用户体验。
(3)问题扩展
语义化标签可以更容易的理解这一块的代码是做什么的。
例如,用户收货地址,可以用Localstorage存储用户当前的收货地址,如果没有新的添加就直接从localstorage中取出。
(4)结合项目中使用
例如:语义化标签、用来做导航栏的标签、使用多媒体增加页面的炫酷程度。
Canvas、svg可以使用echarts、d3.js 制作数据可视化,简单又方便离线存储用于优化用户网速慢导致页面空白问题。

CSS3
(1)问题分析

该题旨在考核求职者对 CSS3的相关新特性有较为深入地了解。
(2)核心问题讲解
在回答这个问题的策略:先告诉面试官CSS3在CSS的基础上面,不仅添加了新的属性还有选择器也做了扩展。
接下来开始列举:
1)先从颠覆性的属性开始比如:rotate(旋转),translate(位移),scale(缩放)等
2)Css3的动画 animation
3)还有是css3的过渡, transition: all 1s;
4)再列举一些简单的属性比如说: border-radius(圆角),box-shadow(盒子阴影),border-shadow(边框阴影)等
5)新增了结构伪类选择器,像 first-child,nth-child(n)之类的
6)先从颠覆性的属性开始比如:rotate(旋转),translate(位移),scale(缩放)等
7)Css3的动画 animation
8)还有是css3的过渡, transition: all 1s;
9)再列举一些简单的属性比如说: border-radius(圆角),box-shadow(盒子阴影),border-shadow(边框阴影)等
10)新增了结构伪类选择器,像 first-child,nth-child(n)之类

进一步了解HTML5和CSS3请看:前端视频教程_html5+css3+移动web实战项目

你可能感兴趣的:(html5,css,html,css3)