HTML5增加的几个新的标签

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

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

先来记录一下吧！

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

举例：

 1 <html>2     <head>3         <title>canvas画布的应用</title>4           <p align="center">画一个矩形<span style="color : #ff0000">龚细军创作</span></p>    </head>5   <body> 6          <canvas id="can" width="400px" height="500px" style="border : 2px solid red"> </canvas>       7     <script type="text/javascript">8         var canvas=document.getElementById("can");9         var cxt = canvas.getContext("2d");
10         //alert(cxt);
11         cxt.style="#FF0000"
12         cxt.fillRect(10,10,30,30);
13     </script>
14      </body>
15 </html>

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

格式：

1 <html>
2   <header>（网页）page的头部</header>
3             你好呀，我是........
4   <footer>网页的尾部</footer>
5 </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)

View Code

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

(2) css3代码选器举例：

 1 <html>2     <head>3         <style type="text/css">4           p:nth-child(odd) {color:red}5       </style>6     </head>7     <body>8         <p >会是个什么颜色呢</p>9         <p >会是个什么颜色呢</p>
10         <p >会是个什么颜色呢</p>
11         <p >会是个什么颜色呢</p>
12     </body>
13 </html>

效果图：

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

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

转载于:https://www.cnblogs.com/goodbeypeterpan/p/3919016.html

HTML5增加的几个新的标签相关推荐

HTML5中的新国际化标签及属性
H5问世其实也有很长一段时间了,时至今日,大部分浏览器都号称对其进行了支持,但效果如何呢?随便找个前端问问,标准答案一般会是--呵呵~~~虽然H5对视频.音频.图象.动画,以及同电脑的交互都已经标准化 ...
页面显示 amp html6,浅谈HTML5 amp;amp; CSS3的新交互特性
本文标题的这副图片,是用Phosotshop制作的.但是,在搜索引擎中你却无法搜索到它,搜索引擎还没有强大到能够识别图片里面的文字.并且由于图片的体积不算太小,可能网速慢的网友在浏览的时候不得不耐心的 ...
在新的标签页中代开编辑文件
我们在windows中使用vim时,经常会通过右键菜单选择"Edit with Vim"来打开文件.但这种方式打开的文件,会在当前窗口中打开,而不是像Ultra Edit那样在一个 ...
html5如何新建定义站点,HTML5技术教程：创建新作品_HTML5教程_创建作品_添加元素_课课家...
我们所熟知的HTM5软件是一款非常强大功能的软件,据我了解HTM5软件的特色也是非常有优势的.我们先来介绍一下它的优势: HTML5可以提供: ①:提高可用性和改进用户的友好体验; ②:有几个新的标签 ...
HTML5对比HTML4带来的新变化
HTML5入门 HTML5是HTML的最新版本,目标是更好地开发网络应用程序. HTML5比HTML4拥有更简洁的语法并且提供了更多新的特性. 本文将对HTML5做一个大体的介绍. HTML5能做什么 ...
2011年11月11号,2345浏览器，的V1.2版本又增加什么好玩的新功能！
系列文章目录第四章:2011年11月11号,2345浏览器,的V1.2版本又增加什么好玩的新功能! 文章目录系列文章目录前言 2011-11-11 V1.2版新增功能新增改进 BUG修复 ...
[html] 举例说明HTML5出来后，有哪些HTML标签被弃用了？
[html] 举例说明HTML5出来后,有哪些HTML标签被弃用了? center u s font ..... 等等违反表现和结构分离原则的标签被弃用个人简介我是歌谣,欢迎和大家一起交流前后端知 ...
selenium使用webdriver新开标签页
from selenium import webdriveroption = webdriver.ChromeOptions() browser = webdriver.Chrome(chrome_o ...
Python-Selenium：如何通过click在新的标签页打开链接？
场景描述在使用Selenium的时候,如果遇到a标签列表,而且每个都需通过点击(click())进入a标签对应的页面进行单独处理,而直接访问a链接无法访问(防盗链),那么这个时候该怎么处理呢? 最好 ...

HTML5增加的几个新的标签

HTML5增加的几个新的标签相关推荐

最新文章

热门文章