通过案例来了解响应式开发的音频控件

最新推荐文章于 2024-07-25 22:55:31 发布

姜鸿阳

最新推荐文章于 2024-07-25 22:55:31 发布

阅读量365

点赞数

分类专栏：响应式web 文章标签：音视频 css html

本文链接：https://blog.csdn.net/weixin_59042297/article/details/130242781

版权

响应式web 专栏收录该内容

8 篇文章 1 订阅

订阅专栏

前言

1.本文讲解的响应式开发技术（HTML5+CSS3+Bootstrap）的HTML5表单等功能方法的代码，这也是很多教材的一个典型案例；

2.本文将讲解涉及到HTML5表单等功能方法的知识点，其它方面会大致讲一下；

3.本代码是使用visual Studio Code编写的，其他软件如DW，HBX等都是可以的；

4.运行浏览器是谷歌，同时推荐使用谷歌浏览器；

5.这个案例是我上学跟老师所讲做出来的，有些地方不是很完美，请见谅也请多赐教；

提示：以下是本篇文章正文内容，下面案例可供参考

一、视频控件的使用方法

1.语法

<audio src="音频文件路径” controls>

需要说明的文字
</aud1o>

2、部分功能介绍

HTML5嵌入的音频格式
属性名称	参数说明
OggVorbis	Ogg格式音频文件的音质、体积大小优于MP3音频格式。其音频文件格式表示方式为audio/ogg
MP3	全称是动态影像专家压缩标准音频层面3，简称为MP3。它被用来大幅度地降低音频数据量，其音频文件格式表示方式为audio/mp3
WAV	数据本身的格式为PCM或压缩型，属于无损音乐格与视频的一种。其音频文件格式表示方式为audio/wavo

二、案例举例

代码如下，仅供参考:

<!DOCTYPE html>
<html>

<head>
  <meta charset="UTF-8">
  <title>Document</title>
</head>

<body>
  <video src="audio/白狐.mp3" controls>
    这是一个简单的播放音频控件
  </video>
</body>

</html>

以上便是video本地音频播放的代码，这是一个本地音频资源。

三、播放效果

运行如下，仅供参考:

姜鸿阳

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
打赏
0
评论
通过案例来了解响应式开发的音频控件

1.本文讲解的响应式开发技术（HTML5+CSS3+Bootstrap）的HTML5表单等功能方法的代码，这也是很多教材的一个典型案例；2.本文将讲解涉及到HTML5表单等功能方法的知识点，其它方面会大致讲一下；3.本代码是使用visual Studio Code编写的，其他软件如DW，HBX等都是可以的；4.运行浏览器是谷歌，同时推荐使用谷歌浏览器；5.这个案例是我上学跟老师所讲做出来的，有些地方不是很完美，请见谅也请多赐教；提示：以下是本篇文章正文内容，下面案例可供参考HTML5嵌入的音频格式。
复制链接

扫一扫