<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>看视频！</title> </head> <body> <video src="一丝不挂.mp4" controls width="1000" preload="metadata" 视频加载失败！> <source src=一丝不挂.mp4" type="video/mp4"> <source src="龙猫.mp4" type="video/ma4" > </video> </body> </html>
结果: 注意，preload之中 auto 是自动缓冲，metadata 是显示第一帧，none 是不缓冲。
加音频也同理:
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>听音频</title> </head> <body> <audio src="和田光司%20-%20butterfly%20-%20数码宝贝主题曲.mp3" controls autoplay> </audio> </body> </html>
结果:
很简单。
有一点很重要，虽然我们直接在video或者audio 标签里面 地址属性什么的搞定后，我们为什么还要在标签里面加 source 标签呢？ 这是为了把这个视频或音频说明一下(地址在哪，格式是啥)，让所有浏览器都兼容。