Html 如何在YouTube上嵌入视频？

我试图将youtube视频设置为bredcrumb背景，但我无法将视频宽度设置为全屏大小。正如您将看到的，下面的图像显示在iframe的中心，而不是全屏显示

/视频左右两侧的黑色条/

这是我的代码：

#我的视频{
位置：绝对位置；
右：0；
排名：0；
底部：0；
宽度：100vw；/*现在它是视口（窗口）宽度的100%*/
显示：内联块；
最小高度：100%；
z指数：-99；
}

这是因为YouTube保持了比例。如果您想让它填满页面的宽度，那么也应该增加高度。

首先，将div包装在另一个具有固定位置的div元素中。
然后，使用绝对位置和全高/全宽为

myVideo

元素和

iframe

设置CSS

最后，要使其正常工作，您需要在16/9前后基于纵横比进行一些媒体查询，以正确定位它。也可以测试不同的位置属性

。视频包装器{
背景：#000；
位置：固定；
排名：0；
右：0；
底部：0；
左：0；
}
#myVideo、.video包装器iframe{
位置：绝对位置；
右：0；
排名：0；
底部：0；
宽度：100%；
身高：100%；
}
@介质（最小纵横比：16/9）{
#myVideo{高度：300%；顶部：-100%；}
}
@介质（最大纵横比：16/9）{
#myVideo{宽度：300%；左侧：-100%；}
}

好的，但我想把它作为面包屑背景，所以不能增加高度。有没有可能裁剪它，或者什么的？如果你的页面没有滚动，那么你可以增加高度，在css文件中写入

html，body{overflow:hidden；}