Question

我目前正在使用网站模板并决定向其添加视频 - 但是，我很难将其集中放置在页面左侧。我已经发布了下面页面的代码（它是一页滚动网站模板的一部分）。

<section id="one" class="main style2 right dark fullscreen">
<div class="content box style2">
                <header>
                    <h2>Latest News</h2>
                </header>
              <p>NASA's Jupiter orbiter, Juno, is now only 3 weeks away from its destination!</p>
            </div>        
  <div style="position: relative; top:1px; left:400px; width:200px; height:25px",></div>
  <iframe width="560" height="315" src="https://www.youtube.com/embed/t0Z5X6sQxeo" frameborder="0" allowfullscreen>      </iframe>
  </div>
    <a href="#two" class="button style2 down anchored">Next</a>
  </section>

Answer 1

您的主要问题似乎是您的iframe超出了您的div。你在iframe之前有一个空div，我假设你想要你的视频。

Answer 2

最简单的方法是使用包装iframe的div参考下面的示例代码。

<section id="one" class="main style2 right dark fullscreen">
  <div class="content box style2">
    <header>
      <h2>Latest News</h2>
    </header>
    <p>NASA's Jupiter orbiter, Juno, is now only 3 weeks away from its destination!</p>
  </div>

  <div style="text-align:center;">
  <iframe width="560" height="315"  src="https://www.youtube.com/embed/t0Z5X6sQxeo" frameborder="0" allowfullscreen>
  </iframe>
  </div>

  <a href="#two" class="button style2 down anchored">Next</a>
</section>

在HTML / CSS中定位嵌入式视频？

2 个答案: