居中Youtube iframe？

<section> 
    <h3>About us</h3> 
    <p>British Airways virtual is one of the largest virtual airlines for Infinite Flight virtual airlines out there. With over 50 pilots, we have a bustling community. Make sure to come over and join us, and experience it for yourself!<br><br> 
     Check out the <a href="about.html">about page</a> for more info!</p><br> 
     <iframe width="80%;" height="500px;" src="https://www.youtube.com/embed/_g3UgCWAdGg" frameborder="0" allowfullscreen></iframe> 
</section>

我有这段代码。任何方式，我可以中间Youtube iframe中间？我试过CSS，但无法弄清楚。居中Youtube iframe？

你可以在这里查看整个文件：https://github.com/GiacomoLaw/british-airways-virtual/blob/master/index.html

谢谢！

来源

2016-11-19 Giacomo Lawrance

裹的iframe有一个div，并给它例如text-align:center; CSS属性...

.divy { 
 
    text-align: center; 
 
}

<section> 
 
    <h3>About us</h3> 
 
    <p>British Airways virtual is one of the largest virtual airlines for Infinite Flight virtual airlines out there. With over 50 pilots, we have a bustling community. Make sure to come over and join us, and experience it for yourself!<br><br> 
 
     <div class="divy"> 
 
     Check out the <a href="about.html">about page</a> for more info!</p><br> 
 
     <iframe width="80%;" height="500px;" src="https://www.youtube.com/embed/_g3UgCWAdGg" frameborder="0" allowfullscreen></iframe> 
 
    </div> 
 
</section>

来源

2016-11-19 12:58:46 odedta

真棒，真的很好！非常感谢。 –

当然:)请注意，其他答案也适用，这是一个例子。 – odedta

或使用margin: auto宽度a display: block

iframe { 
 
    width: 80%; 
 
    height: 500px; 
 
    margin: auto; 
 
    display: block; 
 
    }

<section> 
 
    <h3>About us</h3> 
 
    <p>British Airways virtual is one of the largest virtual airlines for Infinite Flight virtual airlines out there. With over 50 pilots, we have a bustling community. Make sure to come over and join us, and experience it for yourself!<br><br> 
 
     Check out the <a href="about.html">about page</a> for more info!</p><br> 
 
     <iframe src="https://www.youtube.com/embed/_g3UgCWAdGg" frameborder="0" allowfullscreen></iframe> 
 
</section>

来源

2016-11-19 13:08:24 Pedram

使用margin：0px auto;显示：block;

查看下面的代码片段。

section iframe{ 
 
    margin:0px auto; 
 
    display:block; 
 
    width:80%; 
 
}

<section> 
 
    <h3>About us</h3> 
 
    <p>British Airways virtual is one of the largest virtual airlines for Infinite Flight virtual airlines out there. With over 50 pilots, we have a bustling community. Make sure to come over and join us, and experience it for yourself!<br><br> 
 
     Check out the <a href="about.html">about page</a> for more info!</p><br> 
 
     <iframe width="80%;" height="500px;" src="https://www.youtube.com/embed/_g3UgCWAdGg" frameborder="0" allowfullscreen></iframe> 
 
</section>

来源

2016-11-19 13:13:16

居中Youtube iframe？

回答

相关问题