Youtube 嵌入视频适合浏览器大小

Question

请给我一个建议，如何使 youtube 嵌入视频适合浏览器大小？我需要完全填写网站，但我不知道该怎么做。现在我的视频适合宽度或高度。但我两者都需要。你知道怎么做吗？

到目前为止我的代码： HTML：

<div id="bg" class="bg background-image">
          <div class="embed-container">
                <div id="youtube-player"></div> <!-- this row is replaced by iframe with video. i'm using youtube data api.... -->
          </div>
</div>

CSS：

html{
  height: 100%;
}
body {
  min-height: 100%;
}
.bg {
    width: 100%;
    height: 100%;
    overflow: hidden;
    position: absolute;
    left: 0;
    top: 0;
    z-index: -9999;
}
.background-image {
    background: #000;
    background-size: cover;
    min-height: 100%;
    position:absolute;
    bottom:0;
    left:0;
}
.background-overlay {
    background: url('../assets/images/bg_pattern.png') left top;
}

Answer 1

body{margin:0;padding:0}
#youtube-player{width:100%!important;height:100vh;marign:0 ;padding:0}

<div id="bg" class="bg background-image">
          <div class="embed-container">
              <iframe id="youtube-player"  src="//www.youtube.com/embed/ibXepDwdzjs" frameborder="0" allowfullscreen></iframe>
               <!-- this row is replaced by iframe with video. i'm using youtube data api.... -->
          </div>
</div>

我认为你只能使用 css 来制作这样的东西