video 宽高满屏

在安卓微信中，video播放视频会被强制全屏，但是视频播放完毕后退出播放器可以解决。如果想要让video宽高满屏，可以给video样式加上object-fit: cover;属性，这样video即可实现自适应宽高。具体代码如下所示：

.initial-video{
    width: 100%;
    height: 100%;
    position: fixed;
    background-color: #000;
    z-index: 3;
}
.initial-video video{
    width: 100%;
    height: 100%;
    object-fit: cover;
}

其中，object-fit有以下几个属性：fill、contain、cover、none、scale-down。使用object-fit: cover;可以让video自适应宽高并填充满整个屏幕。

相关问题

html video占满屏幕

要让HTML视频占满屏幕，您可以使用CSS来设置其宽度和高度，以及使用JavaScript来动态调整大小适应屏幕大小。

以下是一些实现方法：

1. 使用CSS设置video标签的宽度和高度为100%：

video {
  width: 100%;
  height: 100%;
}

2. 使用JavaScript在窗口大小改变时动态调整video标签的大小：

window.addEventListener("resize", function() {
  var video = document.querySelector("video");
  video.style.width = window.innerWidth + "px";
  video.style.height = window.innerHeight + "px";
});

以上方法可以让HTML视频占满屏幕。但是请注意，视频的分辨率可能会影响其质量，因此您可能需要调整视频分辨率以适应不同屏幕大小。

css video 宽高自适应

要让视频宽高自适应，可以使用 CSS 中的 max-width 和 max-height 属性，设置一个最大宽度和最大高度，然后让视频元素的宽度和高度都为 100%。这样，在保证视频不会超出最大宽度和最大高度的前提下，视频会自动适应其容器的大小。

示例代码如下：

<div class="video-wrapper">
  <video src="myvideo.mp4" controls></video>
</div>

.video-wrapper {
  max-width: 100%;
  max-height: 100%;
}

video {
  width: 100%;
  height: 100%;
}

需要注意的是，视频元素的宽高比例应该与视频本身的宽高比例一致，否则会出现拉伸或留白的情况。如果需要保持视频的宽高比例不变，可以使用 padding-top 或 padding-bottom 属性来设置容器的高度，然后让视频元素的宽度和高度都为 100%。

示例代码如下：

<div class="video-wrapper">
  <div class="video-container">
    <video src="myvideo.mp4" controls></video>
  </div>
</div>

.video-wrapper {
  position: relative;
  padding-top: 56.25%; /* 16:9 */
}

.video-container {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

video {
  width: 100%;
  height: 100%;
}

上面的示例代码假设视频的宽高比例为 16:9，可以根据实际情况进行调整。