为什么我的 iFrame 不水平居中，如何修复？

水平居中 iFrame

查询：

考虑下面的代码片段：

HTML:
<div>div</div>
<iframe></iframe>

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

与周围的div相反，为什么iFrame元素无法居中对齐？如何解决此问题？

响应：

要使 iFrame 水平居中，请应用 display: 块；其 CSS 属性。这是修改后的代码：

HTML:
<div>div</div>
<iframe></iframe>

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

iframe {
    display: block;
    border-style:none;
}

display: block;属性将 iFrame 设置为块级元素，确保它占据自己的行并与其他内容水平对齐。另外，边框样式：无；消除 iFrame 的默认边框以保持居中框的外观。

以上是为什么我的 iFrame 不水平居中，如何修复？的详细内容。更多信息请关注PHP中文网其他相关文章！