HTML5+CSS3_2_音频标签和视频标签

泠泠七弦上111

已于 2024-07-15 18:12:17 修改

阅读量190

点赞数 7

分类专栏： HTML5+CSS3 文章标签： html5 前端

于 2024-07-15 16:33:05 首次发布

本文链接：https://blog.csdn.net/2301_81057751/article/details/140440373

版权

HTML5+CSS3 专栏收录该内容

4 篇文章 0 订阅

订阅专栏

一、音频标签

效果图

代码

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>音频标签</title>
</head>

<body>
  <audio src="audio_20240715.mp3" controls loop autoplay></audio>
  <!-- 
   src：音频URL（支持格式：MP3、Ogg、Wav）
   controls：显示音频控制面板
   loop：循环播放
   autoplay：自动播放（浏览器一般禁用了自动播放功能，所以使用该属性依旧不会自动播放）
  -->
</body>

</html>

二、视频标签

效果图

代码

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>视频标签</title>
</head>

<body>
  <video src="video_20240715.mp4" width="500" controls loop muted autoplay></video>
  <!-- 
     src:视频URL（支持格式：MP4、WebM、Ogg）
     controls：显示视频控制面板
     loop：循环播放
     muted：静音播放
     autoplay：自动播放（浏览器支持在静音状态下播放，使用该属性需同时使用muted静音播放）
     -->
</body>

</html>