Question

以下是我的代码中我试图加载pdf文件的部分：

<div class="panel-body">
    <embed width="600" height="450" src="/pathOnMyPcFromROOT/myfile.pdf"
         type="application/pdf"
    </embed>
</div>

我只得到this(Click Here) ........ 有没有办法解决它？有没有办法点击链接并在新标签中加载pdf？

Answer 1

尝试iframe标记：

<div class="panel-body">
    <iframe src="files/myfile.pdf" width="600" height="450">
</div>

请注意，除了参考webroot之外，网络服务器软件（xampp？mamp？lamp？）不允许您访问PDF文件。最好的办法是将它放在包含index.php（或index.html）文件的文件夹中的文件夹中：

public_html (a.k.a. htdocs or www)
    - css (folder)
    - files (folder)
        - myfile.pdf
    - js (folder)
    - img (folder)
    - index.html (file)

Answer 2

乱搞这个。我用它所有的时间。更改css填充以满足您的需要，还可以更改html的宽度和高度。这是一个响应式代码，因此它适应所有屏幕尺寸

onLayoutChanged()

/* Flexible iFrame */
 
.flexible-container {
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 30px;
    height: 0;
    overflow: hidden;
}
 
.flexible-container iframe,   
.flexible-container object,  
.flexible-container embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

如何将pdf文件加载到html页面？

2 个答案: