html – 在youtube上禁用blackbars嵌入iFrame

概述我将来自youtube的视频嵌入到我的网页中,我想让它在屏幕上100％拉伸,没有黑条.虽然我给它的宽度为100％,但它仍然在视频的两侧有一些黑条.我怎么能摆脱它？ 截图： 摘录：https://jsfiddle.net/o3rp6an9/1/ <div id="video"> <iframe width="100%" height="100%" src="https://www.youtu 我将来自youtube的视频嵌入到我的网页中,我想让它在屏幕上100％拉伸,没有黑条.虽然我给它的宽度为100％,但它仍然在视频的两侧有一些黑条.我怎么能摆脱它？

截图：@L_301_0@
摘录：https://jsfiddle.net/o3rp6an9/1/

<div ID="vIDeo">    <iframe wIDth="100%" height="100%" src="https://www.youtube.com/embed/zWAiQJvwb8Q?autoplay=1&loop=1&controls=0&rel=0&showinfo=0&playList=zWAiQJvwb8Q&modestbranding=1" frameborder="0" allowfullscreen="allowfullscreen"></iframe></div>#vIDeo {    height:100%;    wIDth:100% !important;    background-size:100% 100%;    position:relative;    overflow:hidden;}

还有另一个问题,但它基本上没有帮助我.

解决方法 您希望将视频绝对定位在一个包装器中,该包装器设置与视频宽高比匹配的垂直填充.要获得填充/纵横比,请将视频的高度除以宽度,然后乘以100得到百分比.

* {padding:0;margin:0;Box-sizing:border-Box;}#vIDeo {	position: relative;	padding-bottom: 56.25%; /* 16:9 */	height: 0;}#vIDeo iframe {	position: absolute;	top: 0;	left: 0;	wIDth: 100%;	height: 100%;}

<div ID="vIDeo">		<iframe wIDth="100%" height="100%" src="https://www.youtube.com/embed/zWAiQJvwb8Q?  autoplay=1&loop=1&controls=0&rel=0&showinfo=0&playList=zWAiQJvwb8Q&modestbranding=1" frameborder="0" allowfullscreen="allowfullscreen"></iframe></div>

总结

以上是内存溢出为你收集整理的html – 在youtube上禁用blackbars嵌入iFrame全部内容，希望文章能够帮你解决html – 在youtube上禁用blackbars嵌入iFrame所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。