html - 如何将视频插入帧？

我有这个样本：

link

码：

.container {
  position: relative;
}

.embed-container {
  width: 100%;
  position: absolute;
  top: 0px;
  max-width: 1062px;
}

iframe {
  width: 100%;
  max-width: 1062px;
}

<div class="container">
  <img src="https://www.weltpixel.com/pub/media/wysiwyg/Magento_2_Theme_Pearl_Demo_9.png" alt="Magento 2 Theme Demo 6">


  <div class='embed-container'><iframe src="https://www.youtube.com/embed/OUGB5dqKgpE?autoplay=1&loop=1&cc_load_policy=1rel=0&amp;controls=0&amp;showinfo=0&playlist=OUGB5dqKgpE" frameborder="0" allowfullscreen></iframe></div>
</div>
</div>

我想将视频插入该帧中并进行响应，如下例所示。
如何将该物品放在我想要的位置？

您能帮我找到解决方案吗？

提前致谢！

example

最佳答案

您可以按照我提供的代码段更改样式：

.container {
  position: relative;
}

.embed-container {
  width:40%;
  position:absolute;
  top:290px;
  left:270px;
  max-width:1062px;
}

iframe {
  width: 100%;
  max-width: 1062px;
}

<div class="container">
  <img src="https://www.weltpixel.com/pub/media/wysiwyg/Magento_2_Theme_Pearl_Demo_9.png" alt="Magento 2 Theme Demo 6">


  <div class='embed-container'><iframe src="https://www.youtube.com/embed/OUGB5dqKgpE?autoplay=1&loop=1&cc_load_policy=1rel=0&amp;controls=0&amp;showinfo=0&playlist=OUGB5dqKgpE" frameborder="0" allowfullscreen></iframe></div>
</div>
</div>

关于html - 如何将视频插入帧？，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/44495706/