HTML5 新元素

自1999年以后HTML 4.01 已经改变了很多,今天,在HTML 4.01中的几个已经被废弃,这些元素在HTML5中已经被删除或重新定义。

为了更好地处理今天的互联网应用,HTML5添加了很多新元素及功能,比如: 图形的绘制,多媒体内容,更好的页面结构,更好的形式 处理,和几个api拖放元素,定位,包括网页 应用程序缓存,存储,网络工作者,等。


<canvas> 新元素

标签 描述
<canvas> 标签定义图形,比如图表和其他图像。该标签基于 JavaScript 的绘图 API

新多媒体元素

标签 描述
<audio> 定义音频内容
<video> 定义视频(video 或者 movie)
<source> 定义多媒体资源 <video> 和 <audio>
<embed> 定义嵌入的内容,比如插件。
<track> 为诸如 <video> 和 <audio> 元素之类的媒介规定外部文本轨道。

新表单元素

标签 描述
<datalist> 定义选项列表。请与 input 元素配合使用该元素,来定义 input 可能的值。
<keygen> 规定用于表单的密钥对生成器字段。
<output> 定义不同类型的输出,比如脚本的输出。

新的语义和结构元素

HTML5提供了新的元素来创建更好的页面结构:

标签 描述
<article> 定义页面独立的内容区域。
<aside> 定义页面的侧边栏内容。
<bdi> 允许您设置一段文本,使其脱离其父元素的文本方向设置。
<command> 定义命令按钮,比如单选按钮、复选框或按钮
<details> 用于描述文档或文档某个部分的细节
<dialog> 定义对话框,比如提示框
<summary> 标签包含 details 元素的标题
<figure> 规定独立的流内容(图像、图表、照片、代码等等)。
<figcaption> 定义 <figure> 元素的标题
<footer> 定义 section 或 document 的页脚。
<header> 定义了文档的头部区域
<mark> 定义带有记号的文本。
<meter> 定义度量衡。仅用于已知最大和最小值的度量。
<nav> 定义导航链接的部分。
<progress> 定义任何类型的任务的进度。
<ruby> 定义 ruby 注释(中文注音或字符)。
<rt> 定义字符(中文注音或字符)的解释或发音。
<rp> 在 ruby 注释中使用,定义不支持 ruby 元素的浏览器所显示的内容。
<section> 定义文档中的节(section、区段)。
<time> 定义日期或时间。
<wbr> 规定在文本中的何处适合添加换行符。

已移除的元素

以下的 HTML 4.01 元素在HTML5中已经被删除:

    • <acronym>
    • <applet>
    • <basefont>
    • <big>
    • <center>
    • <dir>
    • <font>
    • <frame>
    • <frameset>
    • <noframes>
    • <strike>
    • <tt>

*HTML5 新元素的更多相关文章

  1. HTML5 新元素、HTML5 Canvas

    HTML5 新元素 自1999年以后HTML 4.01 已经改变了很多,今天,在HTML 4.01中的几个已经被废弃,这些元素在HTML5中已经被删除或重新定义. 为了更好地处理今天的互联网应用,HT ...

  2. Html5学习2(Html表格、Html列表、Html5新元素、Canvas (坐标、路径、画圆、文本、渐变、图像))

    Html表格 1.表格中的表头:<th></th>.其中表头部分字体加粗,颜色深绿色 <h4>水平标题:</h4> <table border=& ...

  3. HTML5: HTML5 新元素

    ylbtech-HTML5: HTML5 新元素 1.返回顶部 1. HTML5 新元素 自1999年以后HTML 4.01 已经改变了很多,今天,在HTML 4.01中的几个已经被废弃,这些元素在H ...

  4. HTML5学习笔记1 HTML5 新元素

    自1999年以后html4.0已经改变了很我,今天,在html4.01中的几个已经被废弃,这些元素在html5中已经被删除或重新定义. 为了更好地处理今天的互联网应用,html5添加了很多新元素及功能 ...

  5. HTML5+CSS3学习笔记(二) 页面布局:HTML5新元素及其特性

    HTML5的语义化标签以及属性,可以让开发者非常方便地实现清晰的web页面布局,加上CSS3的效果渲染,快速建立丰富灵活的web页面显得非常简单. 本次学习HTML5的新标签元素有: <head ...

  6. 随堂笔记之正则与HTML5新元素

    在进入主题前,先插个网站https://www.processon.com/ ProcessOn是一个在线协作绘图平台,为用户提供最强大.易用的作图工具! 它可以很方便的在线简单绘制一些东西,让自己去 ...

  7. HTML5新元素

    <figure> 标签规定独立的流内容(图像.图表.照片.代码等等). <figure> 元素的内容应该与主内容相关,同时元素的位置相对于主内容是独立的.如果被删除,则不应对文 ...

  8. html5新元素练习(1)

    1, <nav>  是专门由于菜单导航,链接导航的元素 2,  <header> 主体页面的头部,与head不同,它的内容可以显示出来 3,  <footer>页面 ...

  9. HTML5 新元素之VIDEO标签的js操作

    本文参考w3school的HTML DOM Video 对象. Video 对象属性 属性 描述 audioTracks 返回表示可用音频轨道的 AudioTrackList 对象. autoplay ...

随机推荐

  1. 一个想法(续二):换个角度思考如何解决IT企业招聘难的问题!

    前言: 上一篇文章:一个想法:成立草根技术联盟对开发人员进行技术定级解决企业员工招聘难问题! 当时写文的思维,是从一个公益组织的角度的思考. 因此,有不少关于从利出发的反方观点,的确是值的思考! 任何 ...

  2. IP101A芯片默认物理地址(PHY Adress)确定

    转载:http://blog.csdn.net/ropai/article/details/6961157 根据IP101A的DataSheet,芯片的第9,10,12,13,15脚为PHYAD0~P ...

  3. QT Creator 代码自动补全快捷键设置

    在QT Creater界面点Tools再进Options...(找到environment->Keyboard)在里面找到FakeVim目录下的,发现默认快捷键就是CTRL+SPACE,把它删除 ...

  4. CSS拾遗+技巧集合

    1.实现尖角符号. 这是内联inline-block标签独有的特性. <!DOCTYPE html> <html lang="en"> <head&g ...

  5. Java设计模式15:常用设计模式之享元模式(结构型模式)

    1. Java之享元模式(Flyweight Pattern) (1)概述:       享元模式是对象池的一种实现,英文名为"Flyweight",代表轻量级的意思.享元模式用来 ...

  6. android 基础项目及开发出现:error opening trace file: No such file or directory错误解决

    本身这个错误不影响运行,但是看着烦啊.解决方案几种如下: 1.xml标签不完整或者未关闭,常有的事.Eclipse并不是所有的xml标记都检查,单双标记什么的. 2.有人说,据说是 android a ...

  7. android开发之路07(无硝烟的战争)

    如何做一名优秀的android面试官? 如何做一名优秀的android候选者? 提到这个问题我不得不提起我们小升初,初升高,高生升本这几个历程中我们与出题人之间的无硝烟的战争.我们总是为自己的成绩担心 ...

  8. JPA与ORM以及Hibernate

  9. javaweb学习总结十九(http协议概述以及http请求信息分析)

    一:http协议概述 1:http协议定义 2:使用telnet程序连接web服务器,获取资源 3:http协议:超文本传输协议,它是基于tcp/ip协议,就是建立在tcp/ip之上工作的, http ...

  10. SharePoint 2013 网站定义中添加页面布局

    今天在Visual Studio 2012中将页面布局打包到网站定义中. 新建Module “MasterPageGallary” 在Element中如下: <Elements xmlns=&q ...