欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

什么是HTML5?Html5新增元素介绍

程序员文章站 2022-03-12 20:17:16
什么是HTML5 首先了解HTML HTML即超文本标记语言(HyperText Markup language),这是一种语法简单、结构清晰的语解释型文档,他不同于其他的编程...

什么是HTML5

首先了解HTML

HTML即超文本标记语言(HyperText Markup language),这是一种语法简单、结构清晰的语解释型文档,他不同于其他的编程语言。

HTML5就是HTML网页标记语言的第五次重大更新产品,在这个版本中,新功能不断推出,以帮助Web应用程序的作者,努力提高新元素互操作性。

HTML5的目标

HTML5他的产生,最简单的目标就是,用更简洁的HTML代码创建更多功能的网页程序!并且HTML5让网页结构变得更加的清楚明了,增加了更加语义化的结构标签,这样

一个网页的结构就非常清晰,那个部位显示的什么内容,让人一目了然!

HTML5的好处

为开发人员节约时间,这句话怎么理解,因为之前我们所使用的HTML/XHTML在各大浏览器之间存在的不兼容问题显示的非常严重的问题,然而HTML5的出现就是为了解决这一个问题,HTML5的目标就是将HTML5网页上的音视频、图像、动画等等都带入一个国际标准化!

结构清晰的HTML5

结构清晰的HTML5,在HTML5中增加了主体元素,比如新增的NAV标签,表示的就是导航的意思,而之间呢,就是用DIV并没有实际的意义

新增的语义化标签

1新增的结构性元素

元素

header元素表示页面中的一个内容区块或者整个页面的标题/头部区域!

元素

nav元素表示页面中的导航链接部分。

元素

article元素表示页面中的一块上下文不相关的的独立内容,比如一篇文章中的文章。

HTML5的使用方法:

元素

section表示页面中的一块内容区块,比如章节的页眉、页脚等等。也可以和Hn(h1、h2..)等一起使用,标示出文档的结构!

元素

footer表示页面或者是页面中的一块区域的页脚,比如存放文件的创建时间、作者、联系方式等等。

新增的行内语义性元素

主要完成web页面具体内容的引用和描述,是丰富内容展示的基础.

meter:表示特定范围内的数值,可用于工资、数量、百分比等。

time:表示时间值。

progress:用来表示进度条,可通过对其max、min、step等属性进行控制,完成对进度的表示和监事。

video:视频元素,用于支持和实现视频文件的直接播放,支持缓冲预载和多种视频媒体格式。

audio:音频元素,用于支持和实现音频文件的直接播放,支持缓冲预载和多种音频媒体格式。

新增的块级性元素

级块性元素主要完成web页面区域的划分,确保内容的有效分割

aside:用于表达注记、贴士、侧栏、摘要、插入的引用等作为补充主体的内容。

figure:是对多个元素进行组合并展示的元素,通常与ficaption联合使用。

code:表示一段代码块。

dialog:用于表达人与人之间的对话,该元素包含dt和dd这两个组合元素,dt用于表示说话者,而dd用来表示说话内容

新增的交互性元素

交互性元素主要用于功能性的内容表达,会有一定的内容和数据的关联,是各种事件的基础。

details:用来表示一段具体的内容,但是内容默认可能不显示,通过某种手段(如单击)与legend交互才会显示出来。

datagrid:用来控制客户端数据与显示,可以由动态脚本及时更新。

menu:主要用于交互菜单(曾被废弃又被重新启用的元素)。

command:用来处理命令按钮。