HTML09：媒体元素

最新推荐文章于 2022-11-30 18:49:32 发布

工一木子

最新推荐文章于 2022-11-30 18:49:32 发布

阅读量121

点赞数

分类专栏： HTML学习

本文链接：https://blog.csdn.net/Prince140678/article/details/118657804

版权

HTML学习专栏收录该内容

19 篇文章 0 订阅

订阅专栏

本文介绍了HTML5中的<video>和<audio>元素，用于在网页中嵌入视频和音频内容。示例代码展示了如何设置资源路径、控制条和自动播放属性。需要注意的是，不同的浏览器对autoplay属性的支持情况可能不同，例如Chrome可能不会自动播放。

摘要由CSDN通过智能技术生成

HTML09：媒体元素

视频和音频

视频元素
- video
音频元素
- audio

代码show

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>媒体元素</title>
    </head>
    <body>
        <!--   音频和视频
                    src:资源路径
                    controls：控制条
                    autoplay：自动播放
             -->
        <!--        <audio src="../resources/audio/MushrooM『蘑菇兄弟』,Neso%20Records%20-%20Love%20You%20Three%203000.mp3" controls autoplay></audio>-->
        <!--        浏览器不支持ncm格式音频-->
        <!--        <audio src="../resources/audio/汪东城%20-%20I%20Love%20You%20(中文版).ncm"  controls autoplay></audio>-->
        <!--   文件名不能包含特殊字符，否则会识别不了，例如：#等     -->
        <!--        <video src="../resources/video/#100天跑步打卡 #day19 #晨跑打卡 #自律改变生活 #赶大集 - 抖音.mp4"></video>-->
        <video src="../resources/video/100天跑步打卡%20%23day19%20%23晨跑打卡%20%23自律改变生活%20%23赶大集%20-%20抖音.mp4" controls
               autoplay></video>
    </body>
</html>

代码结构：

$[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-DxjoKbAK-1625999849000)(C:\Users\Administrator\Desktop\学习笔记\前端学习\HTML\HTML09：媒体元素.assets\image-20210711183712837.png)]$