如何水平居中iframe ?

考虑下面的例子:(现场演示)

HTML:

<div>div</div>
<iframe></iframe>

CSS:

div, iframe {
    width: 100px;
    height: 50px;
    margin: 0 auto;
    background-color: #777;
}

结果:

为什么iframe不像div一样集中对齐?我怎么把它放在中间?

当前回答

最简单的解决方法。

iframe {
    margin:auto;
    display:block;
}

2020-10-13 10:10:03

其他回答

根据http://www.w3schools.com/css/css_align.asp，将左右边距设置为auto指定它们应该平均分割可用的边距。结果是一个居中的元素:

margin-left: auto;margin-right: auto;

2014-09-25 16:18:40

最简单的解决方法。

iframe {
    margin:auto;
    display:block;
}

2020-10-13 10:10:03

将iframe居中的最佳方法和更简单的方法是:

<p align="center"><iframe src="http://www.google.com/" width=500 height="500"></iframe></p>

其中宽度和高度将是你的HTML页面中的iframe的大小。

2015-11-15 14:18:56

添加显示:块;到你的iframe css。

Div, iframe { 宽度:100 px; 高度:50 px; 保证金:0自动; background - color: # 777; ｝ iframe { 显示:块; 边框样式:没有; ｝ < div > div < / div > < iframe的src = "数据:iframe " > < / iframe >

2011-12-03 10:14:49

如果你不能访问iFrame类，然后添加下面的css包装div。

<div style="display: flex; justify-content: center;">
    <iframe></iframe>
</div>

2020-09-23 18:28:49

如何水平居中iframe ?

推荐文章

最新文章

标签