Html 在视频开始之前放置背景色转换

我有一个疑问，我似乎不知道如何解决，基本上我有一个视频，是我的网站的视频表示，我想要的是，在视频开始播放之前显示一个图像，所以我可以防止用户在开始视频之前看到这个循环，如果有连接问题，图像总是显示

目前，我有以下几点：

     <section class="tp-banner-container content_section">
            <div class="embed-responsive embed-responsive-16by9">
              <iframe id="video" class="embed-responsive-item" src="https://www.youtube.com/embed/kn-1D5z3-Cs?autoplay=1&showinfo=0
&start=10&controls=0&modestbranding=1" volume="0">
             </iframe>
            </div>
      </section>

您需要使用attr海报进行抽样，并给出一些高度和宽度

很抱歉，我不想要图像，我想要背景色：/@FilipeCosta海报可以是纯色的吗？嗯，我的视频来自youtube，这不是问题吗，抱歉，但昨天我搜索了很多，似乎我必须使用iframe。你能帮我吗？因为你在iframe中使用youtube托管的视频，你将无法使用HTML视频事件来查看它何时加载/可以播放等，因此，您需要浏览youTube API，看看它是否有回调，让您知道何时隐藏颜色覆盖（或自己主持视频并使用HTML5事件触发操作）

 <video width="470" height="255" poster="placeholder.png" controls>
        <source src="video.mp4" type="video/mp4">
        <source src="video.ogg" type="video/ogg">
        <source src="video.webm" type="video/webm">
        <object data="video.mp4" width="470" height="255">
        <embed src="video.swf" width="470" height="255">
        </object>
    </video>