blocks|key|3943687|text|回复有点晚，但我注意到这些信息可能很难找到，也没有在SO上找到答案，所以它就在这里。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|3943688|尝试一个不同的参数#view=FitH来强制它适应水平空间，而且您还需要以#而不是&作为querystring的开头：|3943689|filename.pdf#view=FitH|code-block|syntax|javascript|3943690|我所注意到的是，如果adobe阅读器被嵌入到浏览器中，这将会起作用，但是chrome将使用它自己版本的阅读器，并且不会以同样的方式响应。在我自己的例子中，chrome浏览器默认缩放到合适的宽度，所以没有问题，但Internet+Explorer需要上面的参数来确保链接总是以正确的视图设置打开pdf页面。|3943691|有关可用参数的完整列表，请参阅此doc|offset|length|3943692|编辑：(惰性模式打开)|style|BOLD|3943693|​|3943694|📷|atomic|3943695|3943696|3943697|3943698|3943699|3943700|entityMap|0|LINK|mutability|MUTABLE|url|https://www.adobe.com/content/dam/acom/en/devnet/acrobat/pdfs/pdf_open_parameters.pdf|1|IMAGE|IMMUTABLE|imageUrl|https://ask.qcloudimg.com/http-save/yehe-900000/e24e7bc0aeac5011e93ce0da4d599233.png|imageAlt|2|https://ask.qcloudimg.com/http-save/yehe-900000/7b763864a2768576b7a2daff68e8c592.png|3|https://ask.qcloudimg.com/http-save/yehe-900000/e41fac16154c9db52f592feff2c85604.png|4|https://ask.qcloudimg.com/http-save/yehe-900000/020c0f5df3be7fac3235dec3289d59a8.png|5|https://ask.qcloudimg.com/http-save/yehe-900000/ba794636584b698fe66c561721e85d4b.png^0|0|0|0|0|G|3|0|0|0|3|0|0|0|1|1|0|0|1|2|0|0|1|3|0|0|1|4|0|0|1|5|0|0^^$0|@$1|2|3|4|5|6|7|1O|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|1P|8|@]|9|@]|A|$]]|$1|D|3|E|5|F|7|1Q|8|@]|9|@]|A|$G|H]]|$1|I|3|J|5|6|7|1R|8|@]|9|@]|A|$]]|$1|K|3|L|5|6|7|1S|8|@]|9|@$M|1T|N|1U|1|1V]]|A|$]]|$1|O|3|P|5|6|7|1W|8|@$M|1X|N|1Y|Q|R]]|9|@]|A|$]]|$1|S|3|T|5|6|7|1Z|8|@]|9|@]|A|$]]|$1|U|3|V|5|W|7|20|8|@]|9|@$M|21|N|22|1|23]]|A|$]]|$1|X|3|V|5|W|7|24|8|@]|9|@$M|25|N|26|1|27]]|A|$]]|$1|Y|3|V|5|W|7|28|8|@]|9|@$M|29|N|2A|1|2B]]|A|$]]|$1|Z|3|V|5|W|7|2C|8|@]|9|@$M|2D|N|2E|1|2F]]|A|$]]|$1|10|3|V|5|W|7|2G|8|@]|9|@$M|2H|N|2I|1|2J]]|A|$]]|$1|11|3|T|5|6|7|2K|8|@]|9|@]|A|$]]|$1|12|3|-4|5|6|7|2L|8|@]|9|@]|A|$]]]|13|$14|$5|15|16|17|A|$18|19]]|1A|$5|1B|16|1C|A|$1D|1E|1F|-4]]|1G|$5|1B|16|1C|A|$1D|1H|1F|-4]]|1I|$5|1B|16|1C|A|$1D|1J|1F|-4]]|1K|$5|1B|16|1C|A|$1D|1L|1F|-4]]|1M|$5|1B|16|1C|A|$1D|1N|1F|-4]]]]

Bit of a late response but I noticed that this information can be hard to find and haven't found the answer on SO, so here it is.

Try a differnt parameter #view=FitH to force it to fit in the horzontal space and also you need to start the querystring off with a # rather than an &amp; making it:

<pre><code>filename.pdf#view=FitH
</code></pre>

What I've noticed it is that this will work if adobe reader is embedded in the browser but chrome will use it's own version of the reader and won't respond in the same way. In my own case, the chrome browser zoomed to fit width by default, so no problem , but Internet Explorer needed the above parameters to ensure the link always opened the pdf page with the correct view setting.

For a full list of available parameters see this <a href="https://www.adobe.com/content/dam/acom/en/devnet/acrobat/pdfs/pdf_open_parameters.pdf" rel="noreferrer">doc</a>

EDIT: (lazy mode on)

<a href="https://i.stack.imgur.com/RV9BO.png" rel="noreferrer"><img src="https://i.stack.imgur.com/RV9BO.png" alt="enter image description here"></a>
<a href="https://i.stack.imgur.com/Mg9cq.png" rel="noreferrer"><img src="https://i.stack.imgur.com/Mg9cq.png" alt="enter image description here"></a>
<a href="https://i.stack.imgur.com/UgN4c.png" rel="noreferrer"><img src="https://i.stack.imgur.com/UgN4c.png" alt="enter image description here"></a>
<a href="https://i.stack.imgur.com/6Mddz.png" rel="noreferrer"><img src="https://i.stack.imgur.com/6Mddz.png" alt="enter image description here"></a>
<a href="https://i.stack.imgur.com/eMmAw.png" rel="noreferrer"><img src="https://i.stack.imgur.com/eMmAw.png" alt="enter image description here"></a>

blocks|key|3943806|text|对我来说，这很有效(我想放大，因为我的pdf容器很小)：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|3943807|++++<embed+src="filename.pdf#page=1&zoom=300"+width="575"+height="500">|code-block|syntax|javascript|3943808|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

For me this worked(I wanted to zoom in since the container of my pdf was small):

<pre><code> &lt;embed src="filename.pdf#page=1&amp;zoom=300" width="575" height="500"&gt;
</code></pre>

blocks|key|1534667|text|这个方法使用了"object"，它也有"embed“。这两种方法都有效：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1534668|<div+id="pdf">
++++<object+id="pdf_content"+width="100%25"+height="1500px"+type="application/pdf"+trusted="yes"+application="yes"+title="Assembly"+data="Assembly.pdf?#zoom=100&scrollbar=1&toolbar=1&navpanes=1">
++++
++++System+Error+-+This+PDF+cannot+be+displayed,+please+contact+IT.
++++</object>
</div>|code-block|syntax|javascript|1534669|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

This method uses "object", it also has "embed". Either method works:

<pre><code>&lt;div id="pdf"&gt;
 &lt;object id="pdf_content" width="100%" height="1500px" type="application/pdf" trusted="yes" application="yes" title="Assembly" data="Assembly.pdf?#zoom=100&amp;scrollbar=1&amp;toolbar=1&amp;navpanes=1"&gt;
 &lt;!-- &lt;embed src="Assembly.pdf" width="100%" height="100%" type="application/x-pdf" trusted="yes" application="yes" title="Assembly"&gt;
 &lt;/embed&gt; --&gt;
 &lt;p&gt;System Error - This PDF cannot be displayed, please contact IT.&lt;/p&gt;
 &lt;/object&gt;
&lt;/div&gt;
</code></pre>

blocks|key|3943890|text|以防万一有人需要它，在firefox中对我来说它是这样工作的|type|unstyled|depth|inlineStyleRanges|entityRanges|data|3943891|<iframe+src="filename.pdf#zoom=FitH"+style="position:absolute;right:0;+top:0;+bottom:0;+width:100%25;"></iframe>|code-block|syntax|javascript|3943892|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

just in case someone need it, in firefox for me it work like this

<pre><code>&lt;iframe src="filename.pdf#zoom=FitH" style="position:absolute;right:0; top:0; bottom:0; width:100%;"&gt;&lt;/iframe&gt;
</code></pre>

blocks|key|5361260|text|对这个问题的回答有点晚了，但是我确实有一些东西要补充，这可能对其他人有用。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|5361261|如果使用iFrame并将pdf文件路径设置为源文件，则加载时将缩小到100%25，这等同于FitH|5361262|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|F|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|G|8|@]|9|@]|A|$]]|$1|D|3|-4|5|6|7|H|8|@]|9|@]|A|$]]]|E|$]]

Bit late response to this question, however I do have something to add that might be useful for others.

If you make use of an iFrame and set the pdf file path to the src, it will load zoomed out to 100%, which the equivalence of FitH

blocks|key|1834259|text|遵循@Rich+answer，我在代码中使用view=FitH在Angular中查看base64内容，如下所示。|type|unstyled|depth|inlineStyleRanges|offset|length|style|BOLD|entityRanges|data|1834260|我分享了使用Angular框架查看带有对象标记的内容base64文件的担忧。|1834261|查看PDF选项|1834262|this.pdfContent+=
++++++URL.createObjectURL(this.b64toBlob(content,+'application/pdf'))+%2B
++++++'#toolbar=0&navpanes=0&scrollbar=0&view=FitH';|code-block|syntax|javascript|1834263|从API中读取PDF内容为|1834264|let+content+=+DataHelper.getDataFromAPI();|1834265|单击显示内容按钮时，请使用|1834266|showData()+{
++++let+content+=+DataHelper.getDataFromAPI();

++++this.pdfContent+=
++++++URL.createObjectURL(this.b64toBlob(content,+'application/pdf'))+%2B
++++++'#toolbar=0&navpanes=0&scrollbar=0&view=FitH';

++++this.pdfview.nativeElement.setAttribute('data',+this.pdfContent);
++}|1834267|在HTML文件中，将对象标记用作|1834268|<object+#pdfview
[data]=''
type="application/pdf"
width="100%25"
height="800px"
>
</object>|1834269|链接角度演示https://stackblitz.com/edit/angular-ivy-tdmieb|1834270|entityMap|0|LINK|mutability|MUTABLE|url|https://stackblitz.com/edit/angular-ivy-tdmieb^0|2|5|M|9|0|O|E|0|0|7|0|0|0|D|0|0|0|D|0|0|0|G|0|0|0|1G|6|1A|0|0^^$0|@$1|2|3|4|5|6|7|1A|8|@$9|1B|A|1C|B|C]|$9|1D|A|1E|B|C]]|D|@]|E|$]]|$1|F|3|G|5|6|7|1F|8|@$9|1G|A|1H|B|C]]|D|@]|E|$]]|$1|H|3|I|5|6|7|1I|8|@$9|1J|A|1K|B|C]]|D|@]|E|$]]|$1|J|3|K|5|L|7|1L|8|@]|D|@]|E|$M|N]]|$1|O|3|P|5|6|7|1M|8|@$9|1N|A|1O|B|C]]|D|@]|E|$]]|$1|Q|3|R|5|L|7|1P|8|@]|D|@]|E|$M|N]]|$1|S|3|T|5|6|7|1Q|8|@$9|1R|A|1S|B|C]]|D|@]|E|$]]|$1|U|3|V|5|L|7|1T|8|@]|D|@]|E|$M|N]]|$1|W|3|X|5|6|7|1U|8|@$9|1V|A|1W|B|C]]|D|@]|E|$]]|$1|Y|3|Z|5|L|7|1X|8|@]|D|@]|E|$M|N]]|$1|10|3|11|5|6|7|1Y|8|@$9|1Z|A|20|B|C]]|D|@$9|21|A|22|1|23]]|E|$]]|$1|12|3|-4|5|6|7|24|8|@]|D|@]|E|$]]]|13|$14|$5|15|16|17|E|$18|19]]]]

Followed @Rich answer, I used view=FitH in my code to view PDF content base64 in Angular as below.
I shared for whom concern about view base64 content PDF file with object tag using Angular framework.
The option for view PDF
<pre><code>this.pdfContent =
 URL.createObjectURL(this.b64toBlob(content, 'application/pdf')) +
 '#toolbar=0&amp;navpanes=0&amp;scrollbar=0&amp;view=FitH';
</code></pre>
Read PDF content from API as
<pre><code>let content = DataHelper.getDataFromAPI();
</code></pre>
When click show content button use
<pre><code>showData() {
 let content = DataHelper.getDataFromAPI();

 this.pdfContent =
 URL.createObjectURL(this.b64toBlob(content, 'application/pdf')) +
 '#toolbar=0&amp;navpanes=0&amp;scrollbar=0&amp;view=FitH';

 this.pdfview.nativeElement.setAttribute('data', this.pdfContent);
 }
</code></pre>
In HTML file use object tag as
<pre><code>&lt;object #pdfview
[data]=''
type=&quot;application/pdf&quot;
width=&quot;100%&quot;
height=&quot;800px&quot;
&gt;
&lt;/object&gt;
</code></pre>
Link Angular demo <a href="https://stackblitz.com/edit/angular-ivy-tdmieb" rel="nofollow noreferrer">https://stackblitz.com/edit/angular-ivy-tdmieb</a>

blocks|key|1834057|text|使用iframe标签显示具有缩放适配的pdf文件|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1834058|<iframe+src="filename.pdf"+width=""+height=""+border="0"></iframe>|code-block|syntax|javascript|1834059|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

Use iframe tag do display pdf file with zoom fit

<pre><code>&lt;iframe src="filename.pdf" width="" height="" border="0"&gt;&lt;/iframe&gt;
</code></pre>

blocks|key|5361443|text|这对我来说很好|type|unstyled|depth|inlineStyleRanges|entityRanges|data|5361444|<embed+src=".file-name.pdf#zoom=FitH"+width="100%25"+height="1930px"+/>|code-block|syntax|javascript|5361445|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

This works fine for me
<pre><code>&lt;embed src=&quot;.file-name.pdf#zoom=FitH&quot; width=&quot;100%&quot; height=&quot;1930px&quot; /&gt;
</code></pre>

I am embedding a local pdf file into a simple webpage and I am looking to set the initial zoom to fit to the object size. Here is what I tried but it is not affecting the zoom.

<pre><code> &lt;embed src="filename.pdf?zoom=50" width="575" height="500"&gt;
</code></pre>

does anyone know how to modify the code so its initial zoom is set to fit the object size.

Zoom to fit: PDF Embedded in HTML

翻译质量差，导致语言生硬或混乱。

没有提供实际的解决方法或示例。

解答不清晰，无法理解或解决问题。

页面排版不美观，阅读体验差。

文章

问答

视频

教程

学习中心

腾讯云实验室

直播

竞赛

腾讯云代码分析专区

腾讯iOA零信任安全管理系统专区

腾讯云架构师技术同盟交流圈

腾讯云数据库专区

腾讯云智能顾问专区

腾讯云原生专区

腾讯混元专区

腾讯云TCE专区

腾讯云Lighthouse专区

腾讯云HAI专区

腾讯云Edgeone专区

腾讯云存储专区

腾讯云智能专区

腾讯轻联专区 

腾讯云开发专区

TAPD专区

腾讯轻量云游戏服专区

EdgeOne AI 安全实战专区

腾讯云最具价值专家

腾讯云架构师技术同盟

腾讯云创作之星

腾讯云开发者先锋

腾讯云代码助手

云原生构建

TAPD 敏捷项目管理

Cloud Studio

SDK中心

API中心

命令行工具

涵盖代码开发、场景应用、自动测试全流程，助你从零构建专属AI助手

一站式MCP教程库，解锁AI应用新玩法

聚焦“写作效率、视觉美观与运行性能”三方面进行全面升级，为您提供更高效、稳定的创作环境

社区富文本&Markdown编辑器全新改版上线，欢迎大家体验!

诚挚邀请您参与本次调研，分享您的真实使用感受与建议。您的反馈至关重要，感谢您的支持与参与！

社区新版编辑器体验调研

我正在嵌入一个本地pdf文件到一个简单的网页，我希望设置初始缩放，以适应对象的大小。这是我尝试过的，但它不会影响缩放。 <embed src="filename.pdf?zoom=50" width="575" height="500">有谁知道如何修改代码，使其初始缩放设置为适合对象大小。

问缩放匹配:嵌入到HTML中的PDF
EN

回答 8

Stack Overflow用户

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问缩放匹配:嵌入到HTML中的PDFEN

回答 8

Stack Overflow用户

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问缩放匹配:嵌入到HTML中的PDF
EN