html - 使用 iframe 的亚马逊广告不可定制

Question

我试图让这个亚马逊广告出现在页面的中央。这是我添加任何内容之前的样子:

        <iframe src="http://rcm-na.amazon-adsystem.com/e/cm?t=websitcom05-20&o=1&p=26&l=ur1&category=primeent&banner=1XSEYPQA2R6RS2D2B802&f=ifr" width="468" height="60" scrolling="no" border="0" marginwidth="0" style="border:none;" frameborder="0"></iframe>

这是在我添加“center”类之后的样子:

<iframe class="center" src="http://rcm-na.amazon-adsystem.com/e/cm?t=websitcom05-20&o=1&p=26&l=ur1&category=primeent&banner=1XSEYPQA2R6RS2D2B802&f=ifr" width="468" height="60" scrolling="no" border="0" marginwidth="0" style="border:none;" frameborder="0"></iframe>

这是中心类的 css 代码:

.center {
margin-left: auto;
margin-right: auto;
 }

我没有对 iframe 元素应用样式。

您可以在这里查看:

Answer 1

默认情况下，iframe 元素是内联。内联元素不考虑边距，因此您需要将元素设置为 block 级别以使边距起作用。

iframe.center {
    margin:0 auto;
    display:block;
}

作为替代方案，您也可以将 text-align:center 放在父元素上。由于 inline 元素遵守此属性，因此默认情况下它会有效地将 iframe 居中。