Question

我正在尝试将pdf嵌入我的html页面：

<!DOCTYPE html>

<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title>GetPDF</title>
</head>
<body>
    <object data="/Content/Exams/2016/T205_16.pdf" type="application/pdf" width="100%" height="100%"></object>
</body>
</html>

但是运行此程序时，我得到的宽度为100％（好），但是高度仅为100px，而不是预期的100％。

Answer 1

默认情况下，HTML块元素（包括<html>和<body>元素）仅与其内容一样高。也就是说，它们“缩小”以适合其内容的高度。 PDF对象的height属性设置为100％，但是由于它是其父对象（而不是视口）的100％，并且PDF的父对象正在缩小以适合内容，因此PDF对象将以其最小高度显示。

您需要将PDF对象的父级（<body>元素）设置为视口的高度。使用CSS可以轻松做到这一点-只需将<html>元素的height CSS属性设置为100％以填充视口，然后将<body>元素的高度设置为100％以填充{{1 }}元素。

将此代码添加到您的<html>：

<head>

将pdf嵌入html高度不会破坏

1 个答案: