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. CodeForces 384A Coder

    Coder Time Limit:1000MS     Memory Limit:262144KB     64bit IO Format:%I64d & %I64u Submit Statu ...

  2. 头文件为什么要加#ifndef #define #endif

    #ifndef 在头文件中的作用 在一个大的软件工程里面,可能会有多个文件同时包含一个头文件,当这些文件编译链接成一个可执行文件时 ,就会出现大量“重定义”的错误.在头文件中实用#ifndef #de ...

  3. CALayer总结（二）

    1.CATransaction 事务: UIView有两个方法,+beginAnimations:context:和+commitAnimations,和CATransaction的+begin 和+ ...

  4. 进程&线程

    进程与线程的区别 什么是进程(Process):普通的解释就是,进程是程序的一次执行,而什么是线程(Thread),线程可以理解为进程中的执行的一段程序片段.在一个多任务环境中下面的概念可以帮助我们理 ...

  5. vector的插入、lower_bound、upper_bound、equal_range实例

    对于这几个函数的一些实例以便于理解: #include <cstdlib> #include <cstdio> #include <cstring> #includ ...

  6. iOS - Swift Dictionary 字典

    前言 public struct Dictionary<Key : Hashable, Value> : CollectionType, DictionaryLiteralConverti ...

  7. [转载] Linux下查看内存使用情况方法总结

    原文: http://9iphp.com/linux/1247.html 强烈推荐 htop.

  8. mysql 中文字段排序( 按拼音首字母排序) 的查询语句

    在处理使用Mysql时,数据表采用utf8字符集,使用中发现中文不能直接按照拼音排序 如果数据表tbl的某字段name的字符编码是latin1_swedish_ci select * from `tb ...

  9. javaMail编写案列

    package common.impl; import java.util.Properties; import javax.mail.BodyPart; import javax.mail.Mess ...

  10. JavaWeb学习计划

    1 HTML2 CSS3 JavaScript4 XML5 Tomcat6 Servlet7 HTTP8 Cookie Session9 JSP10 JSTL11 MySQL12 JDBC13 过滤器 ...