美文网首页
HTML基础学习——音频、视频和其他标签

HTML基础学习——音频、视频和其他标签

作者: 思君_4cd3 | 来源:发表于2019-08-18 20:29 被阅读0次
  • HTML对音频和视频的支持:
    <audio>支持音频
    <video>支持视频

一.<video>支持视频

支持的浏览器:IE9,10,11\Chrome\Firefox\Safari\Opera...

直到现在,仍然不存在一项旨在网页上显示视频的标准。
今天,大多数视频是通过插件(比如 Flash)来显示的。然而,并非所有浏览器都拥有同样的插件。
HTML5 规定了一种通过 video 元素来包含视频的标准方法。

视频格式支持情况
支持格式
代码显示:
代码如下
结果显示
其中的路径和文件夹的内容如下:
路径
内容
ogv格式播放
结果如下
PS:如果下载的是MP3或者MP4想要转换为其他格式时,推荐一个在线转换网页比较好用~
https://www.xunjieshipin.com/video
  • 也可以进行筛选播放视频的格式,如果第一个打不开则打开第二个,它提供浏览器最大限度的兼容性,这是比较常用的一种方法。

代码如下:


代码如下
结果如下

二.<audio>支持音频

支持的浏览器:IE9,10,11\Chrome\Firefox\Safari\Opera...

直到现在,仍然不存在一项旨在网页上播放音频的标准。
今天,大多数音频是通过插件(比如 Flash)来播放的。然而,并非所有浏览器都拥有同样的插件。
HTML5 规定了一种通过 audio 元素来包含音频的标准方法。
audio 元素能够播放声音文件或者音频流。


音频格式支持情况
支持格式
代码如下
结果如下

三.实现页面布局的三种方式

1.老式的<table>布局(基本上被淘汰)
2.现在还是主流的<div>布局
3.还有未来的语义化标签布局
  • HTML5其他特性:
    1.canvas
    2.地理位置
    3.离线存储
    4.WebSocket
    5.拖放
    6.Web Workers
    (此文章仅作为个人学习笔记使用,如有错误欢迎指正~)

相关文章

网友评论

      本文标题:HTML基础学习——音频、视频和其他标签

      本文链接:https://www.haomeiwen.com/subject/bampjctx.html