1. HTML5：是最新的HTML标准
2. HTML5的新特性：
①语义特性：
<header>：代表页面或section的头部区域，通常包含H1-H6或hgroup、搜索框、nav等
<footer>：页面或section的脚部区域，通常包含该节的一些基本信息，如作者、相关文档链接等
<nav>：页面的导航链接区域，用于整个页面的主要导航部分
<article>：代表一个在文档、页面或网站中自成一体的内同
<section>：文档中的“节”或“段”，通常还带标题
<aside>：代表页面或article中主要内容的附属信息部分，如当前文章的标签、相关资料、侧边栏、日子链接、分类导航、广告等
<hgroup>：页面或section的标题，通常包含连续多个H1-H6标签
<time>：定义公历的时间或日期
<mark>：突出显示文本
<figure>：规定独立的流内容（图像、图表、照片、代码等），与主内容相关，但删除后不对文档流产生影响
<figcaption>：figure元素的标题，置于figure元素的第一个或最后一个子元素的位置
②本地存储特性：
localStorage（永久性的本地存储）：永不失效除非手动删除
sessionStorage（会话级别的本地存储）：浏览器关闭后失效
Application Cache：浏览器设置：<html manifest="demo.appcache">；服务器需要维护一个manifest清单.用于存储静态资源。
IndexedDB：一种轻量级的NOSQL数据库，比sqlite更加高效
③本地设备兼容特性
④连接特性：
WebSocket：实现了浏览器与服务器全双工通信，服务器和客户端可以在给定的时间范围内的任意时刻相互推送消息，允许跨域通信
Server-Sent Event：定义了API来打开一个HTTP连接，通过该连接能够获取从服务器推送的通知
⑤网页多媒体特性：支持网页端的Audio、Vedio、拖拽操作、获取地理位置等功能
⑥三维、图形及特效特性：基于SVG、Canvas、WebGL及CSS3的3D功能
⑦性能与集成特性
⑧CSS3特性
3. ①新增的input的类型(12个)：email、url、number、range、search、color、date、month、week、time、datetime、datetime-local
②新增的表单元素（3个）：datalist、keygen、output
③新增的form属性（2个）：autocomplete、novalidate
④新增的input属性（18个）：autocomplete、autofocus、form、width、height、list、min、max、step、multiple、pattern、placeholder、required、formaction、formenctype、formmethod、formnovalidate、formtarget
4. HTML5废弃的元素：
①能用css替代的元素：basefont、big、center、font、s、strike、tt、u
②frame框架相关的：frame、frameset、noframes
③其它：applet、dir等
5. HTML5新API：canvas（2D绘图）、drag&drop（拖放）、Fullscreen（全屏）、Page Visibility（页面可见性）、getUserMedia（访问设备）、Battery（电池）、history（历史记录）、Link Prefetching（预加载网页内容）等
6. CSS3新特性：
①新选择器（具体查看w3school中的选择器参考手册）
CSS3 新选择器
②@font-face：引入自定义的web字体。各浏览器的支持写法：
@font-face{
font-family:'YourWebFontName';
src : url('YourWebFontName. eot');/* IE9 Compat Modes */
src : url('YourWebFontName .eot?#iefix')format('embedded-opentype'),/* IE6-IE8 */
url('YourWebFontName. woff')format('woff'),/* Modern Browsers */
url('YourWebFontName. ttf')format('truetype'),/* Safari, Android, iOS */
url('YourWebFontName. svg#YourWebFontName')format('svg');/* Legacy iOS */}
③word-wrap & text-overflow & overflow:hidden :协同工作，文本溢出时效果
④text-decoration（文字渲染）：text-fill-color、text-stroke-color、text-stroke-width
⑤实现多列布局（添加浏览器前缀）：column-count、column-rule、column-gap
⑥颜色已提供透明度的支持，边框可以显示圆角（border-radius）
⑦gradient（渐变，需添加浏览器前缀）：线性渐变、径向渐变
⑧box-shadow、text-shadow、box-reflect（支持的浏览器：chrome 13.0+、Safari 5.1+）
⑨背景效果：background-clip、background-origin、background-size、background-break、多背景图片
⑩transform（添加浏览器前缀）：图形学里的基本变化，如skew、scale等
transition（添加浏览器前缀）：如 transition : width 2s linear;
animation（添加浏览器前缀）：如 animation ： myMove 2s infinite;
网友评论