HTML5又2008年诞生，HTML5大致可以等同于=html+css3+javascriptapi....

so --->支持css3强大的选择器和动画以及javascript的新的函数

先来记录一下HTML5增加的几个新的标签吧！

1。  <canvas>画布标签 HTML5的新标签

举例：

 <html>

     <head>

         <title>canvas画布的应用</title>

           <p align="center">画一个矩形<span style="color : #ff0000">龚细军创作</span></p>    </head>

   <body>

          <canvas id="can" width="400px" height="500px" style="border : 2px solid red"> </canvas>

     <script type="text/javascript">

         var canvas=document.getElementById("can");

         var cxt = canvas.getContext("2d");

         //alert(cxt);

         cxt.style="#FF0000"

         cxt.fillRect(10,10,30,30);

     </script>

      </body>

 </html>

2. 增加了<header> <forder>  这两个标签做到了网页和结构的分离 (使用seo 即搜索引擎)

格式：

 <html>

   <header>（网页）page的头部</header>

             你好呀，我是........

   <footer>网页的尾部</footer>

 </html>

3.增加了音频<audio>和 音频<video>两个新的标签........。

    <video src"=http://video.baomihua.com/37784322/32372832?ptag=vsogou" poster="C:\Users\Administrato\Desktop\火影Q版人物集\10.jpg"  controls="controls" width="500px" height="400px">呵呵，放不了哦！</video>

         <!--嵌入一段音频-->

效果图：  （注意： 目前html所支持的格式为： mp4/ogg格式）

同理，音频也是一样的...
4. 增加了离线存储功能
   
5. 支持语音识别   6.支持图像识别 7.支持游戏
8.支持强大的css3......（动画和选择器）
(1)
 <!DOCTYPE html>

 <html>

     <head>

         <!--meta charset="utf-8"/-->

         <title>Gxjun</title>

         <!--CSS3模块-->

         <style type="text/css">

                  div{

                background-color: red;}

            @-webkit-keyframes mycolor {

          0%{background-color: red;}

          40%{background-color: blue;}

          70%{background-color: yellow;}

           100%{background-color: red;}

               }

           div: hover{

                -webkit-animation-name: mycolor;

                -webkit-animation-duration: 1s;

                -webkit-animation-timing-function:linear;

             }

         </style>

     </head>

     <body>

                     <div>hehhe</div>

     </body>

 </html>

以上呈现的是一个字体颜色逐渐变化的样式..

(2) css3代码选器举例：

 <html>

     <head>

         <style type="text/css">

           p:nth-child(odd) {color:red}

       </style>

     </head>

     <body>

         <p >会是个什么颜色呢</p>

         <p >会是个什么颜色呢</p>

         <p >会是个什么颜色呢</p>

         <p >会是个什么颜色呢</p>

     </body>

 </html>

效果图：

6.支持拖放，跨文档，浏览器历史管理

7.各个浏览器的浏览器的兼容性很好....

学习HTML5之新特性标签一览（详细）的更多相关文章

  1. Atitit html5.1 新特性attilax总结

    Atitit html5.1 新特性attilax总结 9. 嵌入 header 和 footer1 7. 校验表单1 6. 浏览器的上下文菜单2 1. 响应式图像2 Attilax觉得还不错的心特性 ...

  2. Web开发者应当开始学习HTML5的新功能

    据国外媒体报道,谷歌开发者业务部门高管马克·皮尔格雷姆(Mark Pilgrim)在WWW2010会议上表示,尽管还需要进一步完善,HTML5已经获得大多数平台支持,适合完成大多数任务. 但并非所有人 ...

  3. WEB学习笔记14-HTML5新特性的使用

    (1)定义文档类型声明 <!DOCTYPE html> (2)定义页面编码 <!—HTML 4.01中定义的设置页面编码的方式--> <meta http-equiv=& ...

  4. Atitti html5 h5 新特性attilax总结

    Atitti html5 h5 新特性attilax总结 Attilax觉得不错的新特性 3.语义Header和Footer (The Semantic Header and Footer) 8.占位 ...

  5. 浅谈HTML5的新特性

    2014年10月29日,W3C宣布,经过接近8年的艰苦努力,HTML5标准规范终于制定完成. HTML5将会取代1999年制定的HTML 4.01.XHTML 1.0标准,使网络标准达到符合当代的网络 ...

  6. HTML5的新特性：范围样式，又叫做<style scoped>

    Chromium 最近实现了一个HTML5的新特性:范围样式,又叫做<style scoped> .开发者可以通过为根元素设定一个添加了scoped属性的style标签,来限制样式只作用于 ...

  7. 可能是最早的学习Android N新特性的文章

    可能是最早的学习Android N新特性的文章 Google在今天放出了Android N开发者预览版.Android N支持Nexus6及以上的设备.5太子Nexus5不再得到更新. Android ...

  8. 从零开始一起学习SLAM | C++新特性要不要学？

    LAM,C++编程是必备技能.不过,大家在学校里学习的书本一般比较老,主要还是C++98那些老一套. 本文所谓的C++新特性是指C++11及其以后的C++14.C++17增加的新关键字和新语法特性.其 ...

  9. HTML5 的新特性以及新标签的浏览器兼容问题

    新特性: HTML5 现在已经不是 SGML 的子集,主要是关于图像,位置,存储,多任务等功能的增加. 1)  拖拽释放(Drag and drop) API 2)  语义化更好的内容标签(heade ...

随机推荐

  1. C#在泛型类中，通过表达式树构造lambda表达式

    场景 最近对爬虫的数据库架构做调整,需要将数据迁移到MongoDB上去,需要重新实现一个针对MongoDB的Dao泛型类,好吧,动手开工,当实现删除操作的时候问题来了. 我们的删除操作定义如下:voi ...

  2. 图片轮播的JS写法，通用涉及多个轮播

    本代码是借鉴大神的代码分析理解后,自己改写的!有不足指出希望给为大神指点. 核心只有一个JS,里面包含了css样式. 展示效果图:

  3. HQL语句大全（转载）

    Hibernate配备了一种非常强大的查询语言,这种语言看上去很像SQL.但是不要被语法结构 上的相似所迷惑,HQL是非常有意识的被设计为完全面向对象的查询,它可以理解如继承.多态 和关联之类的概念. ...

  4. Quartz.Net 调度框架配置介绍

    在平时的工作中,估计大多数都做过轮询调度的任务,比如定时轮询数据库同步,定时邮件通知等等.大家通过windows计划任务,windows服务等都实现过此类任务,甚至实现过自己的配置定制化的框架.那今天 ...

  5. MVC3远程验证

    public class StudentModel { [Display(Name="学生编号")] public int StuId { set; get; } [Require ...

  6. SQL & PL/SQL 模块总结

    SQL 1. 各种function 2. merge 3. connect by PL/SQL 1. pl/sql 寄出 2. 游标 3. procedure 4. function 5. packa ...

  7. 01 Developing Successful Oracle Applications

    varchar2 类型定义时, 个人认为应该选择byte 类型, 即 varchar2(20), oracle 支持的最大的字符串是 varchar2(4000), 同时, 个人认为, 当你定义一个v ...

  8. EF执行存储过程

    //执行strSql/procSql //返回受影响的行数 int i = dbsql.Database.ExecuteSqlCommand("exec getActionUrlId @na ...

  9. 12/09 Oracle练习之新建表

  10. (六)C语言之typedef详解

    1.typedef可以看作type define的缩写,顾名思义就是类型定义,也就是说它只是给已有的类型重新定义了一个方便使用的别名,并没有产生新的数据类型.typedef的使用与宏定义define有 ...