相关疑难解决方法(0)

我遇到的问题是视频的侧面或顶部/底部总是有黑条,具体取决于屏幕尺寸.

任何想法如何让它全屏显示总是没有显示恼人的黑条？并且不使用插件.

这是我的标记:

    <div id="full-bg">
        <div class="box iframe-box" width="1280" height="800">
            <iframe src="http://player.vimeo.com/video/67794477?title=0&amp;byline=0&amp;portrait=0&amp;color=0fb0d4" width="1280" height="720" frameborder="0" webkitAllowFullScreen mozallowfullscreen allowFullScreen></iframe>
        </div>
    </div>

    #full-bg{
        width: 100%;
        height: 100%;
        img{
            display: none;
        }
        .iframe-box{
            width: 100%;
            height: 100%;
            position: absolute;
            background: url(../img/fittobox.png);
            left: 0 !important;
            top: 0 !important;
            iframe{
                width: 100%;
                height: 100%;
            }
        }
    }

我将来自youtube的视频嵌入到我的网页中,我想让它在屏幕上100%拉伸,没有黑条.虽然我给它的宽度为100%,但它仍然在视频的两侧有一些黑条.我怎么能摆脱它？

截图: 摘录: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;
}

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