假设媒体是Vimeo视频,则宽度设置为100%,但是如果我将高度设置为自动,则高度会太低。

后来,我为视频/媒体设置了500px的高度,但是有一种方法可以将高度设置为宽度的200%。

<iframe src="https://player.vimeo.com/video/113657402" width="100%" height="500" frameborder="0" title="&quot;Super Sleuths&quot;" webkitallowfullscreen="" mozallowfullscreen="" allowfullscreen=""></iframe>

最佳答案

尝试此操作,height: 56.25vw;将保持16:9宽高比



.wrapper {
  position: relative;
  height: 56.25vw;
  width: 100%;
  margin: 0 auto;
}

.wrapper iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

<div class="wrapper">
  <iframe src="https://player.vimeo.com/video/113657402" width="100%" height="500" frameborder="0" title="&quot;Super Sleuths&quot;" webkitallowfullscreen="" mozallowfullscreen="" allowfullscreen=""></iframe>
</div>

07-24 09:48
查看更多