Youtube 视频作为网页的背景答案

【问题标题】：Youtube video as background for webpageYoutube 视频作为网页的背景
【发布时间】：2017-09-27 06:25:06
【问题描述】：

我需要 youtube 视频作为我网页的背景。这是我的代码

<section class="about-section">

           <div class="video-background">
<div class="video-foreground">
  <iframe src="https://www.youtube.com/embed/UY9V5S9MEgk?controls=0&showinfo=0&rel=0&autoplay=1&loop=1&playlist=W0LHTWG-UmQ" frameborder="0" allowfullscreen></iframe>
</div> </div> </section>

这工作正常。我的问题是我需要使用以下 youtube 视频作为我的背景，但它不起作用。我尝试了这两个 URL，但都不起作用

https://youtu.be/UY9V5S9MEgk

这些是我尝试过的 URL

https://www.youtube.com/watch?v=UY9V5S9MEgk

【问题讨论】：

在这里查看我的 iFrameless/JS/CSS 唯一解决方案stackoverflow.com/questions/41616179/…

标签： html css video youtube background

【解决方案1】：

试试这个：

<section class="about-section">   
  <div class="video-background">
    <div class="video-foreground">
      <iframe src="https://www.youtube.com/embed/UY9V5S9MEgk" frameborder="0" allowfullscreen>
      </iframe>
    </div> 
  </div> 
</section>

<!DOCTYPE html>
<html>
<body>

<iframe width="420" height="345" src="https://www.youtube.com/embed/UY9V5S9MEgk">
</iframe>

</body>
</html>

【讨论】：

【解决方案2】：

试试这个：

<div style="position: fixed; z-index: -99; width: 100%; height: 100%">
  <iframe frameborder="0" height="100%" width="100%" 
    src="https://youtube.com/embed/UY9V5S9MEgk?autoplay=1&controls=0&showinfo=0&autohide=1">
  </iframe>
</div>

【讨论】：

【解决方案3】：

复制您的 youtube 视频的嵌入代码并将其替换为您当前的

<iframe width="854" height="480" src="https://www.youtube.com/embed/UY9V5S9MEgk?controls=0&showinfo=0&rel=0&autoplay=1&loop=1&playlist=W0LHTWG-UmQ" frameborder="0" allowfullscreen></iframe>

【讨论】：

【解决方案4】：

这个问题已经解决了[点击这里][1]

如果您有任何疑问，请给我留言。

[1]: https://codepen.io/dudleystorey/pen/PZyMrd

和[点击这里][1]

  [1]: https://www.labnol.org/internet/youtube-video-background/27933/

【讨论】：