video.js 更改视频比列且不改变父盒子大小

如果您想更改视频的比例，而不改变父容器的大小，您可以使用 CSS 来实现这一点。您可以通过设置视频的 `padding-top` 或 `padding-bottom` 属性来创建一个具有指定比例的占位符，然后将视频的宽度设置为 100%。

以下是一个示例代码：

<div class="video-container">
  <video id="my-video" class="video-js vjs-default-skin" controls preload="auto">
    <source src="your-video-source.mp4" type="video/mp4">
    <!-- 其他视频源 -->
  </video>
</div>

.video-container {
  position: relative;
  width: 100%;
  padding-top: 56.25%; /* 16:9 比例的视频占位符 */
}

#my-video {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

在上述代码中，`.video-container` 类设置了一个相对定位的容器，并使用 `padding-top` 属性创建了一个占位符，具有 16:9 的比例（即 `padding-top` 的值为容器宽度的 56.25%）。视频元素 `#my-video` 使用了绝对定位，填充了整个容器，并设置了宽度和高度为 100%。

通过这种方式，视频将根据父容器的大小进行调整，并保持指定的比例。

请根据您需要的比例进行相应的修改。希望这可以帮助到您！如果您有任何进一步的问题，请随时提问。