HTML5视频标签怎样播放本地（硬盘）视频文件

在网页开发中，使用HTML5视频标签播放本地硬盘视频文件是一项常见需求。掌握这一技巧，能为网页增添丰富的多媒体元素，提升用户体验。

HTML5的<video>标签为我们提供了播放视频的便捷方式。确保你的网页文件与要播放的视频文件在合理的目录结构下。比如，将视频文件放置在与HTML文件同一目录，或者创建一个专门的“videos”文件夹来存放视频。

在HTML代码中，基本的<video>标签使用方式如下：

<video src="your-video-filename.mp4" controls></video>

这里，src属性指定了视频文件的路径及文件名，“your-video-filename.mp4”需替换为实际的视频文件名。controls属性则为视频播放器添加了用户控制界面，方便用户进行播放、暂停、调整音量等操作 。

如果视频文件存放在子文件夹中，路径要正确书写。例如，视频在“videos”文件夹里，代码应为：

<video src="videos/your-video-filename.mp4" controls></video>

除了基本的播放设置，HTML5视频标签还有许多实用属性。width和height属性可设置视频播放器的宽度和高度，以适应网页布局。如：

<video src="your-video-filename.mp4" controls width="640" height="480"></video>

autoplay属性能让视频在页面加载完成后自动播放。不过，为了用户体验和节省流量，现代浏览器对自动播放有一定限制。代码示例：

<video src="your-video-filename.mp4" controls autoplay></video>

loop属性可使视频播放完毕后自动循环播放，适用于一些需要重复展示的视频内容：

<video src="your-video-filename.mp4" controls loop></video>

HTML5视频标签支持多种视频格式，常见的有MP4、WebM、Ogg等。为确保在不同浏览器中都能正常播放，可以使用<source>标签提供多种格式的视频源：

<video controls>
  <source src="your-video-filename.mp4" type="video/mp4">
  <source src="your-video-filename.webm" type="video/webm">
  <source src="your-video-filename.ogg" type="video/ogg">
  你的浏览器不支持视频播放。
</video>

通过合理运用HTML5视频标签及其属性，就能轻松实现本地硬盘视频文件在网页中的播放，为网页带来生动丰富的视频内容。