Question

所以在我的网站上 http://umbrellacorperation.com/

我想做什么？

我正在尝试在横幅中播放视频，并将iframe的大小调整为人们在其设备上使用的任何分辨率
尝试确保自动播放
制作徽标，文字和广告按钮位于视频前面（显然无效）

可悲的是，我对html5知之甚少，而且这基本上和基本上一样快。

以下是已经制作的代码部分，但我确信我在很多方面做错了

<div id="banner">
  <iframe width="600" height="1000" src="https://www.youtube.com/embed/BkEQZc1RH5M?rel=0&amp;controls=0&amp;showinfo=0" frameborder="0" gesture="media" allow="encrypted-media" allowfullscreen></iframe>
<div class="container">
<div class="title">
            <h2>Welcome to Umbrella Corperation</h2>
              <span class="byline">Come join our Wonderful Community</span></div>
            <ul class="actions">
              <img src="images/apilogo3.png" width="300" height="300" alt=""/>
              <li><a href="http://umbrellacorperation.com/forum/" class="button">Click here for Forum Access</a></li>
          </ul>
        </div>
    </div>

如果有人可以帮助我开展工作，我将非常感激！

Answer 1

使用此代码作为视频播放的参考：

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>HTML5 Video Player</title>
<style>
    body {
            font-family: sans-serif;
            border: 0;
            margin: 0;
            padding: 0;
    }
    header {
            text-align: center;
    }
    #player {
            display: table;
            width: 100%;
            padding: 4px;
    }
    #player > div {
            display: table-cell;
            vertical-align: top;
    }
</style>
</head>
<body>
<header>
    <h1>HTML5 Video Player</h1>
</header>
<section id="player">
    <div>
        <video src="yourvideo.mp4"
            controls
            width="720" height="480">
            Your browser does not support the video element, please #D try <a href="yourvideo.mp4">downloading the video instead</a>
            </video>
        </div>
</section>
</body>
</html>

根据需要修改CSS。

在横幅制作视频

1 个答案: