如何在html添加视频

在HTML中添加视频的方法有很多种，这里我将详细介绍如何使用HTML5的<video>标签来添加视频，HTML5的<video>标签是HTML5新增的元素之一，它提供了一种简单的方法来嵌入视频内容。

1. 使用<video>标签

你需要在HTML文件中插入一个<video>标签，这个标签有一些属性，如controls、width和height等，可以帮助你控制视频的播放。

<video width="320" height="240" controls>
  <source src="movie.mp4" type="video/mp4">
  <source src="movie.ogg" type="video/ogg">
  您的浏览器不支持Video标签。
</video>

在上述代码中，width和height属性定义了视频播放器的大小，controls属性则添加了播放、暂停和音量控制等控件。

<source>标签用于指定视频文件的来源，你可以提供多种格式的视频文件，以便浏览器可以选择最适合的一种来播放，在上面的例子中，我们提供了两种格式的视频文件：MP4和Ogg。

如果浏览器不支持<video>标签或者不支持指定的视频格式，那么将显示<video>标签内部的文本。

2. 使用JavaScript控制视频播放

除了使用HTML5的<video>标签，你还可以使用JavaScript来控制视频的播放，你可以创建一个按钮，当用户点击这个按钮时，视频就开始播放。

你需要在HTML文件中创建一个<button>元素和一个<video>元素：

<button id="playButton">播放视频</button>
<video id="myVideo" width="320" height="240" controls>
  <source src="movie.mp4" type="video/mp4">
  <source src="movie.ogg" type="video/ogg">
  您的浏览器不支持Video标签。
</video>

你可以在JavaScript中使用getElementById方法获取这两个元素，并添加事件监听器：

var video = document.getElementById("myVideo");
var playButton = document.getElementById("playButton");
playButton.addEventListener("click", function() {
  if (video.paused) {
    video.play();
  } else {
    video.pause();
  }
});

在上述代码中，我们首先获取了视频播放器和播放按钮的元素，我们为播放按钮添加了一个事件监听器，当用户点击这个按钮时，我们就检查视频是否正在播放，如果视频正在播放，我们就暂停视频；如果视频没有播放，我们就开始播放视频。

以上就是在HTML中添加视频的基本方法，需要注意的是，由于不同的浏览器可能支持的视频格式不同，所以在提供视频文件时，最好提供多种格式的文件，以便浏览器可以选择最适合的一种来播放，也需要注意版权问题，确保你有权使用这些视频文件。