怎么将视频images/home_loop_720p.mp4在以上html中用CSS编写达到全局循环播放

要在 HTML 中使用 CSS 编写循环播放视频，您可以按照以下步骤进行操作：

1. 将视频文件 `images/home_loop_720p.mp4` 放置在您网站的适当位置。

2. 在您的 CSS 文件中，为视频的容器元素创建一个类选择器，例如 `.video-container`。

3. 使用 CSS 属性 `background` 将视频作为容器的背景，并设置循环播放的样式。在这里，我们使用 `background-size: cover;` 来确保视频填充整个容器。

   .video-container {
       background: url(images/home_loop_720p.mp4) no-repeat;
       background-size: cover;
       -webkit-background-size: cover; /* 兼容性设置 */
       -moz-background-size: cover; /* 兼容性设置 */
       -o-background-size: cover; /* 兼容性设置 */
       background-repeat: no-repeat;
       background-position: center center;
       animation: playVideo 10s infinite; /* 通过动画实现循环播放 */
   }

   @keyframes playVideo {
       0% { background-position: 0% 0%; }
       100% { background-position: 100% 100%; }
   }

这段 CSS 代码将视频作为背景，使用 `animation` 属性设置了一个名为 `playVideo` 的动画，持续时间为 10 秒，并且无限循环播放。`@keyframes` 定义了动画的关键帧，以实现从起始位置到结束位置的背景位置变化。

4. 在您的 HTML 文件中，将视频容器元素添加到相应的部分，比如主页的部分。将视频容器元素的类设置为先前定义的类选择器，如 `.video-container`。

   <section id="home">
       <div class="video-container"></div>
       <!-- 其他主页内容 -->
   </section>

通过这些步骤，您就可以使用 CSS 编写全局循环播放视频的效果了。请确保视频文件的路径正确，并根据需求调整 CSS 中的其他样式属性。