HTML基础(二)——HTML5新增标签

书读的越多而不加思考,你就会觉得你知道得很多;而当你读书而思考得越多的时候,你就会越清楚地看到,你知道得很少。

导读:本篇文章讲解 HTML基础(二)——HTML5新增标签,希望对大家有帮助,欢迎收藏,转发!站点地址:www.bmabk.com,来源:原文

基本概念

HTML5 是超文本标记语言(HTML)的第五次重大修改,可以简单的理解为是 HTML 的第五个大版本。

某些情况会将 HTML5 简称为 H5。

某些情况说 HTML5(H5)表示的是 HTML 的第五个版本。

某些情况说 HTML5(H5)表示的是移动端的网页效果

某些情况说 HTML5(H5)表示的是 HTML5、CSS3、以及 HTML5 配套的 JavaScript 接口。例如操作视频,操作画布,获取地理信息等。

某些情况说 HTML5(H5)表示的是手机端整屏的轮播图效果。

HTML5 新特性

  • 布局元素
  • 媒体元素
  • 画布(<canvas>),例如刮刮乐。
  • SVG(定义矢量图)
  • 表单新特性

布局元素

布局元素相当于一个有语义的 div 

常用的 HTML5 元素有:

  • header:网页头部
  • nav:导航栏
  • aside:侧标栏
  • article:显示文章
  • section:布局的一部分
  • footer:网页页脚

媒体元素

1、audio 标签:在网页中播放音频

常用属性:

  • src 属性:音频地址
  • controls 属性:显示播放控制面板。
<audio src="media/again.mp3" controls></audio>

加上 controls 属性后:网页上会显示音乐播放的控制面板(控制面板的样式由浏览器默认提供)

HTML基础(二)——HTML5新增标签

 也可以自定义控制面板样式,需要JS调用相应接口。

2、video 标签:在网页中播放视频

该标签常用属性有:

  • src 属性:视频地址。
  • controls 属性:显示控制面板。
  • autoplay 属性:视频自动播放。设置后,对于低版本浏览器来说可以自动播放;对于高版本浏览器,需要设置静音才能够自动播放。(这种现象现在也很常见,也是为了优化用户使用体验)
  • muted 属性:设置为静音。

示例:

<video src="media/video.mp4" controls autoplay muted></video>

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。

文章由极客之音整理,本文链接:https://www.bmabk.com/index.php/post/122898.html

(0)
飞熊的头像飞熊bm

相关推荐

发表回复

登录后才能评论
极客之音——专业性很强的中文编程技术网站,欢迎收藏到浏览器,订阅我们!