时间戳

首页 > 解决方案 > 删除黑色背景 vimeo 播放器 iframe

css - 删除黑色背景 vimeo 播放器 iframe

问题描述

我在 IFrame 内的 HTML 页面中嵌入了 vimeo 播放器。但我注意到图像中有黑色背景。我希望视频填充整个视频容器，但我似乎无法修改#playeriframe 内部。我该怎么做呢？下面是实际输出的图像和我使用的源代码

在此处输入图像描述

这就是我定义它的方式

<div class="video-holder">
    <iframe src="https://player.vimeo.com/video/5590682?" frameborder="0" allowfullscreen="allowfullscreen"></iframe>
</div>

现在我尝试做这样的事情

.video-holder. {
   position: relative;
}
.video-holder iframe body html #player {
    // Code here. 
   position: absolute;
   top: 0;
   left: 0;
   width: 100%
   height: 100%
   max-width: 100%;
}

但是经过检查，似乎我的选择器不起作用，并且无法修改#player 元素。如何使视频充满整个容器（.video-holder）。

请注意，如果我将浏览器的大小调整为更小的宽度，视频会以一定的宽度填充容器，但我想要的是让它适合任何屏幕大小。像这样的东西在此处输入图像描述

所以基本上我想覆盖元素中max-width: calc(133.333vh)定义的#player

我知道修改 iframe 是针对 XSS 但有没有办法告诉 vimeo 中的视频适合容器或使宽度为 100% 或其他东西

标签： csscss-selectors

解决方案

将background-color样式添加到 iframe。

所以你的代码应该是这样的：

<div class="video-holder">
    <iframe src="https://player.vimeo.com/video/5590682?" style="background-color: #fff" frameborder="0" allowfullscreen="allowfullscreen"></iframe>
</div>

更改background-color为您想要的任何内容。

这将解决您的问题。

推荐阅读