html 中 video标签全屏

在HTML中，要使视频标签（<video>）全屏显示，可以使用以下方法之一：

1. 使用JavaScript实现点击事件使视频全屏播放：

<video loop onClick="javascript:clickVideo();" controls>
  <source src="" type="video/webm">
</video>
<script>
  function clickVideo() {
    var video = document.querySelector('video');
    if (video.requestFullscreen) {
      video.requestFullscreen();
    } else if (video.mozRequestFullScreen) {
      video.mozRequestFullScreen();
    } else if (video.webkitRequestFullScreen) {
      video.webkitRequestFullScreen();
    }
  }
</script>

2. 使用CSS样式让视频标签铺满父元素：

<div style="width: 100%; height: 100%;">
  <video controls style="width: 100%; height: 100%; object-fit: fill;">
    <source src="" type="video/webm">
  </video>
</div>

其中，关键是添加了`object-fit: fill;`的样式，它可以让视频内容拉伸以填充整个容器。