官方网站下载方法,西安大型网站建设,深圳住房和建设局网站登录,wordpress首页添加幻灯文章目录 前言一、音频标签#xff1a;audio1.audio简介2.常用属性controlsautoplayloop代码演示#xff1a; 二、视频标签#xff1a;video1.video2.常用的视频元素controlsautoplayloop代码演示#xff1a; 总结视频元素总结音频元素总结 前言
html中插入音频和视频的方… 文章目录 前言一、音频标签audio1.audio简介2.常用属性controlsautoplayloop代码演示 二、视频标签video1.video2.常用的视频元素controlsautoplayloop代码演示 总结视频元素总结音频元素总结 前言
html中插入音频和视频的方法基本相同
音频格式mp3、ogg、wav
视频格式mp4、ogv、webm 一、音频标签audio
1.audio简介
audio标签用来向页面中引入一个外部的音频文件。音视频文件引入时默认情况下不允许用户自己控制播放按钮。
以下情况在页面中不会显示需要加上controls audio src/audio2.常用属性
controls
controls是否允许用户控制播放。
audio src歌曲路径 controls/audioautoplay
autoplay音频文件是否自动播放。如果设置了autoplay则音乐在打开页面时会自动播放但是目前来讲大部分浏览器都不会自动对音乐进行播放。
audio src歌曲路径 controls autoplay/audioloop
loop 音乐是否循环播放。设置了此属性则音乐会进行循环播放。
audio src controls loop/audio代码演示
!DOCTYPE html
html langen
headmeta charsetUTF-8titleTitle/title
/head
body
audio src歌曲路径 controls autoplay loop/audio/body
/html运行结果
二、视频标签video
1.video
video向网页中引入一个视频使用方法和audio类似。
video src视频路径/video2.常用的视频元素
controls
controls是否允许用户控制播放。
audio src视频路径 controls/audioautoplay
autoplay视频文件是否自动播放。如果设置了autoplay则视频在打开页面时会自动播放但是目前来讲大部分浏览器都不会自动对视频进行播放。
audio src视频路径 controls autoplay/audioloop
loop 视频是否循环播放。设置了此属性则视频会进行循环播放。
audio src视频路径 controls loop/audio代码演示
!DOCTYPE html
html langen
headmeta charsetUTF-8titleTitle/title
/head
body
video src周杰伦-晴天(蓝光).mp4 controls loop autoplay width500px height300px/video
/body
/html运行结果 总结
视频元素总结
属性说明src要播放的视频的URLcontrol向用户系统显示控件比如播放按钮autoplay视频就绪后马上播放loop当媒体文件完成播放后再次开始播放preload视频在页面加载完时就开始加载并开始预备播放如果使用autoplay则该属性忽略poster规定视频正在加载时显示的图像直到用户单击播放按钮width设置视频播放器的宽度height设置视频播放器的高度
音频元素总结
属性说明controls显示或隐藏用户控制界面autoplay媒体是否自动播放loop媒体是否循环播放paused媒体是否暂停只读属性ended媒体是否播放完毕只读属性currentTime当前播放进度duration媒体播放总时间只读属性volume0.0到1.0的音量相对值muted是否静音
