谈谈Html5新增的标签

Html5是一个超文本标签语言,相比于上个版本而言,增加了很多新的标签,这里呢只谈谈一些简单而又容易被大家忽视的,像常用的<header><footer>标签这里就不做表述。

操作方法

  • 01

    <article> 标签:主流浏览器都支持(IE9以下不支持),这个元素可以用来写一些论坛、贴吧、报纸、博客、还有一些评论,它支持全局属性还有事件属性。以下是演示:

  • 02

    <section> 强制规定一个文章或者文档中的节(section、区段)。经常用来一些章节等等,使用率不是很高。要用在有标题和内容的情况下,只有内容的时候不适用,它支持全局属性还有事件属性。以下是演示:

  • 03

    <nav>用来标记页面中导航链接的部分,常用在页面尾部一些推广链接等等,适用性很广,使用也很频繁,主流浏览器都支持(IE9以下不支持)。以下是演示:

  • 04

    <aside>用来标记当前内容之外的内容,但是应该要与附近的内容有关系。经常是用在某篇文章的侧边栏,还有一些参考资料,作为文章的附属信息,它支持全局属性还有事件属性,主流浏览器都支持(IE9以下不支持)。以下是演示:

  • 05

    <time>是一个语义化的时间,代表某个具体的时刻或者是日期,允许有时间差,但是使用的频率不是很高,了解就好,因为当前主流浏览器都不支持。以下是演示:

  • 06

    <figure>经常用做文章中的插图,与内容应该密切有关,但是就算是删除,也不应当影响文档的使用,主流浏览器都支持(IE9以下不支持),另外呢 <figcaption> 元素可以为 figure 添加标题,很实用呢。以下是演示:

  • 07

    <audio>定义文档中的音频,html5的重要元素,可以在文档中插入音频控件,相比于其他的插件,这个插件更能被主流浏览器兼容。最好是写成像我下面的那样,单纯的写audio,里面的wav格式不能被IE兼容。以下是演示:

  • 08

    <video>定义文档中的视频,Html5 的重要元素,可以在文档中插入视频控件,网络上也有很多的其他控件,但是在做移动端的时候会出现很多兼容性的问题。还是需要些安卓接口来调用本地播放器,苹果机上不会有这样的问题。主流浏览器都是支持的。

  • 09

    另外还新增了其他的元素像一些video视频元素、embed媒体元素、mark标记元素、progress元素、ruby元素,canvas元素、details元素、source元素、menu元素、input等等

(0)

相关推荐

  • HTML5语义化标签的理解与意义

    很多面试官会问:对于 HTML5语义化标签的理解.那么本篇专门解答一下这个问题. 除了让开发人员 更加理解你的html结构及 代码易读之外,当然有更有深度有趣的原因. . 操作方法 01 首先对W3C ...

  • HTML5新增标签一

    介绍HTML5中新添加的标签用法于说明. 操作方法 01 <aside>  添加附注,用于包含于当前文档相关的内容,如侧栏提示文档相关文档,也可以使用来放广告.相关内容链接,一个完全独立的 ...

  • HTML5新增表单标签六

    介绍HTML5中新添加表单标签用法于说明. 操作方法 01 我们不会再标记中设置contentEditable属性,要设置也是通过javascript,并且在编辑完成后再取消可编辑的功能. (不要把这 ...

  • Win10 10120预览版Edge浏览器新增新标签页特性

    随着Windows 10发布日期的日益临近,微软也加快了全新浏览器Edge的开发进度,在最新的Windows 10 build 10120中,开发人员对浏览器的新标签页进行了改进. 从图片中你可以看到 ...

  • 谈谈Html5的新特性

    Html5的市场是越来越火爆,作为一名前端开发者,这些特性你都知道吗? 操作方法 01 定义文档类型的方式不同,HTML5将会采用最新的定义方式,更加的简洁,更容易使用. 02 在引入脚本的时候,不需 ...

  • 怎样在html网页中插入视频

    html技术发展得非常快,比如现在html5已经支持在网页中插入视频了.今天咪咪我就来教教大家怎样在html中插入视频. 操作方法 01 第一步,在Hbuilder中新建一个项目,然后把视频素材给保存 ...

  • 如何使用HTML5标签控制文字内容缩进对齐分割

    HTML5语言中使用的元素标签进行排版,可以对文字内容进行缩进对齐分割.其中,缩进的标签元素是<blockquote>,对齐是使用<pre>标签,即是保持文字原模原样显示出来, ...

  • html5常用标签使用实例

    很多人可能由于习惯,有时虽然知道html5的新标签语义明晰,但有时依然绕不过弯,想都不想直接用div了.这里了简单介绍一下几个html5中的标签,并做一个简单的样例. 操作方法 01 首先,heade ...

  • HTML5网站有什么优点?

    html5网站设计技术的特点有: 操作方法 01 1. 代码简洁 HTML5网页的冗余代码比传统网页要少很多,极大方便了程序员和用户. 02 2.全新的标签,网站定义更丰富 相对于旧版本的HTML,H ...