Question

我有完整的HTML代码，基本上有一个显示本地PDF的对象元素。我希望这个对象元素在div.conainer中居中。我用margin：0 auto;并期望它在对象的两边添加边距以使其居中。但是对象没有边距。

<!DOCTYPE html>
<html lang="en">
<head>
    <link rel="stylesheet" href="stylesheet.css" />
</head>
<body>
    <section>
        <div class="container">
            <h2>TITLE OF THE THING</h1>
            <object data="somepdf.pdf" type="application/pdf"></object>
        </div>
    </section>
</body>
</html>

随着时间的推移：

section{
    position:relative;
    background-color:#323776;
}

object{
    position:relative;
    margin:0 auto;
}

h1{
    max-width: 100px;
    width: 80vw;
    margin: 0 auto;
}

我尝试输入固定值作为保证金，例如10px或20vw。当我给边距一个确切的值时，object元素有边距。然而，在我看来，汽车应该工作。请教育我。

问题

为什么我的对象元素的边距为零？
为什么保证金自动居中h2而不是对象元素？

我在这里附上了一个屏幕截图，向您展示我所看到的内容。

Answer 1

这是否意味着＆lt; object＆gt;元素的默认显示是否不是阻止？

是;它通常是内联或内联块。 HTML中的大多数嵌入内容元素通常呈现为内联级替换元素。其中包括iframe，img和object。您几乎从未在无格式的HTML页面中看到嵌入式内容 - 当您这样做时，可能是因为除了周围的文本之外，它位于自己的p元素中。

为什么我的对象元素的边距为零？

这是因为自动水平边距在内联级别替换元素上归零。请参阅规范的10.3.2部分。（第10.3.10节简单地链接回10.3.2。）

为什么保证金自动居中h2而不是对象元素？

见上文。

为什么设置保证金自动居中心h2，但不是居中对象？

问题

1 个答案: