1、第一步：准备一个mp4的视频文件
2、第二步: 把视频文件放到assets文件夹下
3、书写代码：首先定义样式居中，代码如下
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>一个简单的视频提速网页</title> </head> <style> .header { overflow: hidden; display: flex; align-items: center; justify-content: center; } video { margin-top: 50px; } </style> <body> <div class="header"> <video src="../mp4/5999e6a2ba70bfa863da83c0c6d0189a.mp4"></video> </div> </body> </html>
4、结合video的简单属性去写
4.1 现在先添加视频就绪自动标签
4.2 写了这个属性muted也能够自动播放，chrome添加就支持自动播放了
4.3 添加显示播放控件
4.4 设置无限循环
5、参考对照项目，现在添加倍速
6、倍速整理资料，现在我想要将倍速提升到这些,3px 5px 15px 20px 50px
7、先整理资料吧！！！
在现代化的网站中，视频播放已经成为了不可或缺的一部分。而对于视频播放的需求也越来越多样化，比如倍速播放、调节声音、拖动进度条、生成智能字幕等。本文将介绍如何使用Vue实现这些功能：
8、Vue实现个人网盘视频存储界面_vue 网盘-CSDN博客，这个大佬的写的真的很好
html中video标签使用几常见问题-CSDN博客，这位大佬写的也真的很好
9、JS设置视频播放速度,加速网课视频小技巧
9.1 本文转载于：JS设置视频播放速度,加速网课视频小技巧_网页视频加速代码-CSDN博客
document.querySelector('video').playbackRate = 5;
进入到要加速的视频页面按F12打开控制控制台输入代码并回车
document.getElementsByTagName("video")[0].playbackRate = 5;
10、调整video的播放速率
有时候，自己在看视频的时候，给你调节的速率往往就是0.5，1，1.5，2倍，有时候不是自己想要的速度，例如看日剧，1.5像是正常播放速度，2倍速又太快，那么，1.75左右才算是刚刚好，所以就来自己设置一下吧，只需要两行代码。
下面以我看的的一个网站为例举例一下。
1.打开开发者工具，找到video标签的class或者id
2、控制条输入这两行代码
var video = document.querySelector(".dplayer-video-current");
video.playbackRate = 1.75
11、自己弄一个网页试试：这个大佬也很厉害，里面有很多可以可以参考的资料
哔哩哔哩 B站 bilibili 视频倍速设置 视频倍速可自定义_谷歌allow pasting-CSDN博客
12、下一步，把加速的代码输入到这里：
document.querySelector('video').playbackRate = 2.5
13、绑定速率
