html - CSS 替换 YouTube 嵌入的黑条

Question

我正在尝试将 YouTube 视频作为 slider 的背景。就目前而言，视频位于完美的位置。我只想在黑条所在的位置放一张图片:https://www.dropbox.com/s/fjvlxamvjqtyx54/Screenshot%202015-08-18%2012.05.53.png?dl=0
这是我的代码:

<div id="slide_0" class="slide-content">
          <div class="slide-bg" style="background: url('/assets/images/pages/home/home-background.jpg') center top no-repeat;background-size: cover;">
            <iframe height="100%" width="100%" src="https://www.youtube.com/embed/6MWYmtT6bvc?rel=0&autoplay=1" frameborder="0" allowfullscreen></iframe>
          </div>
          <div class="slide-footer">
            <table>
              <tr class="middle">
                <td>
                  <center>
                  </center>
                  <img class="logo" id="slider-logo" src="/assets/images/pages/home/heading-1.png" alt="">
                </td>
              </tr>
              <tr class="bottom">
                <td>
                  <div class="slide-caption">
                      <div class="content">
                            <span class="caption"><img class="globe" src="/assets/images/pages/home/globe1.png" alt="">Ray caters for international appointments and makes regular visits to Moscow, New York, The Middle East and most European Cities, stay tuned for the dates of his next trip.</button>
                      </div>
                  </div>
                </td>
              </tr>
            </table>
          </div>
        </div>

我希望背景图像(第 2 行)成为视频的背景。

注意我是如何使用 height="100%"和 width="100%"的。在删除宽度属性时，我剩下:https://www.dropbox.com/s/pq2t4basz4lhf8a/Screenshot%202015-08-18%2012.09.03.png?dl=0
如果能帮上忙就好了
谢谢!
托比。

Answer 1

这是做不到的。
视频周围的黑色填充是播放器的一部分，与视频本身位于同一“层”上。 Youtube 将其用于填充视频周围的额外空间，以便他们可以保持视频的纵横比，同时仍然能够使播放器适应请求的大小(width 和 height 参数)。