如何将视频插入帧？

Question

我有这个样本：

link

CODE：

＆＃13;

＆＃13;

.container {
  position: relative;
}

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

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

＆＃13;

<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>

＆＃13;

＆＃13;

＆＃13;

我想将视频插入该帧，并在下面的示例中做出响应。 如何将该项目定位在我想要的位置？

请帮我找一个解决方案吗？

提前致谢！

example

Answer 1

您可以根据我提供的代码段更改样式：

＆＃13;

＆＃13;

.container {
  position: relative;
}

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

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

＆＃13;

<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>

＆＃13;

＆＃13;

＆＃13;