音频和视频标签

音频用audio标签

controls表示控制栏

loop循环播放音频

autoplay自动播放(浏览器基于隐私一般不支持)

html 复制代码
<!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>音频</title>
</head>
<body>
    <h1>音频用audio标签,controls表示控制栏,loop循环播放音频,
    autoplay自动播放,muted静音播放</h1>
    <audio src="/jiejie.wav" controls loop autoplay muted></audio>
</body>
</html>

视频用video标签

controls表示控制栏

loop循环播放音频

autoplay自动播放

muted静音播放,poster设置视频封面。

支持宽高属性最好和视频分辨率大小一致(也可在css设置)

html 复制代码
<!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>视频</title>
    <style>
        /* video{
            width:300px;
            height:300px;
        } */
    </style>

</head>
<body>
    <h1>视频用video标签,controls表示控制栏,loop循环播放音频,
        autoplay自动播放,muted静音播放,poster设置视频封面。
        支持宽高属性最好和视频分辨率大小一致(也可在css中设置)</h1>
    <video src="/movie.mp4" controls loop autoplay muted poster="/poster.jpg"
    width="300px" height="300px"></video>
    
</body>
</html>
相关推荐
Mintopia几秒前
实时 AIGC:Web 端低延迟生成的技术难点与突破
前端·javascript·aigc
小鱼儿亮亮1 分钟前
五、Redux进阶:UI组件、容器组件、无状态组件、异步请求、Redux中间件:Redux-thunk、redux-saga,React-redux
前端·react.js
Mintopia2 分钟前
Next.js 性能优化双绝:Image 与 next/font 的底层修炼手册
前端·javascript·next.js
jingling5557 分钟前
uniapp | 解决组件样式不生效问题
前端·css·uni-app·html·学习方法
小菜全8 分钟前
使用UniApp实现下拉框和表格组件页面
开发语言·前端·javascript·elementui·前端框架·html
三十_A13 分钟前
【工具】41K star!网页一键变桌面应用
前端·开源
wordbaby36 分钟前
解锁时光机:用 React Hooks 轻松实现 Undo/Redo 功能
前端·react.js
呐谁吃饭了44 分钟前
网络安全学习-6
前端
北辰alk44 分钟前
深入剖析Redux中间件实现原理:从概念到源码
前端