从零开始学前端（HTML篇）：6、多媒体元素

最新推荐文章于 2022-12-14 17:30:55 发布

不文艺的青年

最新推荐文章于 2022-12-14 17:30:55 发布

阅读量72

点赞数 1

文章标签：前端 html javascript

本文链接：https://blog.csdn.net/WuYanZu6243/article/details/126891966

版权

多媒体元素

video 视频
audio 音频

代码如下：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <!-- 
        布尔属性介绍：
        布尔属性：有两种状态，1.不写，不用这个功能。2.写，取值为属性名。
        布尔属性，在HTML5中，可以不用书写属性值，如:controls="controls"可直接写成controls
        video的属性介绍：
        controls:布尔属性，控制控件（例如暂停键、音量键等等）的显示
        autoplay:布尔属性，自动播放(有的浏览器不能自动播放，怕吓到用户，当配合静音播放muted,自动播放可以实现)
        muted:布尔属性，静音播放
        loop:布尔属性，循环播放
     -->
    <video controls autoplay muted loop>
        <!-- 里面可以多个视频，视频从上往下，上一个如果可以播放，则下面的全部不会显示，如果上一个播放不了，便往下找 -->
        <source src="./../图片和视频/ShiPing1.mp4">
    </video>
</body>
</html>