Aprendrem com incrustar fitxers PDF en documents HTML , a més de conèixer la seva implementació mitjançant exemples. De vegades, és possible que vulgueu inserir un fitxer PDF en un document o codi HTML per fer que el contingut sigui més interactiu. Com que els formats són tan diferents, no és fàcil fer la tasca.
Aquests són els mètodes següents per fer-ho:
Taula de contingut
Mètode 1: Ús Etiqueta d'objecte
- L'etiqueta d'objecte d'HTML és la primera manera d'incrustar fitxers PDF. A l'exemple següent, el fitxer pdf es mostrarà en una pàgina web, que és un objecte.
- A més d'incrustar un fitxer PDF a una pàgina web, l'etiqueta d'objecte pot incrustar miniaplicacions ActiveX, Flash, vídeo, àudio i Java.
- Els documents interactius es poden adjuntar a un objecte incrustat amb una etiqueta HTML.
- Es pot mostrar segons les vostres necessitats a la pantalla utilitzant els atributs d'alçada i amplada de l'objecte.
Exemple 1 : Aquest exemple descriu la incrustació d'un fitxer PDF en HTML mitjançant l'etiqueta d'objecte.
HTML PDF a HTMLtitle> cap><style>.pdf { amplada: 100%; relació d'aspecte: 4/3; } .pdf, html, cos { alçada: 100%; marge: 0; farciment: 0; } h1, h3 { text-align: center; } h1 { color: verd; } estil> <body> <h1>techcodeview.comh1><h3>Inserció del fitxer PDF mitjançant Object Tagh3><object>objecte> cos> html>>></pre> </code> <p dir='ltr'> <b> <strong>Sortida:</strong> </b> </p> <br /> <div id="container-4ae8242bd8e42d94c5c0bf390d5144e6"></div><br /> <img src='//techcodeview.com/img/geeks-premier-league-2022/50/how-embed-pdf-file-using-html.webp' alt=""><h2 id='method-2-using-an-iframe'> <b> <strong>Mètode 2: utilitzant un</strong> </b> <a href='/html-iframes' rel=''> <b> <strong>iframe</strong> </b> </a> </h2><ul><li value='1'><span>L'ús d'una etiqueta iframe és la segona manera d'incrustar un fitxer pdf en una pàgina web HTML. En el desenvolupament web, els desenvolupadors web utilitzen l'etiqueta iframe per incrustar fitxers en diversos formats i fins i tot altres llocs web dins d'una pàgina web.</span></li><li value='2'><span>A causa de la seva àmplia compatibilitat, l'etiqueta iframe s'utilitza àmpliament per incrustar pdf.</span></li><li value='3'><span>Un navegador que no admet documents PDF o l'etiqueta d'objecte també pot utilitzar aquesta etiqueta per incrustar un codi HTML PDF.</span></li></ul><p dir='ltr'> <b> <strong>Exemple 2</strong> </b> <span>: Aquest exemple descriu la incrustació d'un fitxer PDF en HTML mitjançant un iframe.</span></p>HTML<code class='hljs'> <pre class='hljs'> <html> <head> <title>PDF a HTMLtitle> cap><style>.pdf { amplada: 100%; relació d'aspecte: 4/3; } .pdf, html, cos { alçada: 100%; marge: 0; farciment: 0; } h1, h3 { text-align: center; } h1 { color: verd; } estil> <body> <h1>techcodeview.comh1><h3>Inserció del fitxer PDF mitjançant Iframe Tagh3> <iframe>iframe> body> html>>></pre> </code> <p dir='ltr'> <b> <strong>Sortida:</strong> </b> </p> <img src='//techcodeview.com/img/geeks-premier-league-2022/50/how-embed-pdf-file-using-html.webp' alt=""><h2 id='method-3-using-embed-tag'> <b> <strong>Mètode 3: Ús</strong> </b> <b> <strong>incrusta l'etiqueta</strong> </b> </h2><ul><li value='1'><span>Quan s'incorpora un codi HTML pdf en un lloc web, l'etiqueta d'inserció no s'utilitza tan sovint com les etiquetes anteriors perquè si el navegador de l'usuari no pot gestionar els fitxers PDF, la pantalla quedarà en blanc.</span></li><li value='2'><span>El mètode d'inserció d'un codi HTML pdf s'utilitza quan no cal proporcionar contingut alternatiu.</span></li></ul><p dir='ltr'> <b> <strong>Exemple</strong> </b> <span>: aquest exemple descriu la incrustació d'un fitxer PDF en HTML mitjançant l'etiqueta d'inserció.</span></p> <br /> <div id="container-4ae8242bd8e42d94c5c0bf390d5144e6"></div><br />HTML<code class='hljs'> <pre class='hljs'> <html> <head> <title>PDF a HTMLtitle> cap><style>.pdf { amplada: 100%; relació d'aspecte: 4/3; } .pdf, html, cos { alçada: 100%; marge: 0; farciment: 0; } h1, h3 { text-align: center; } h1 { color: verd; } estil> <body> <h1>techcodeview.comh1><h3>Incrustar el fitxer PDF mitjançant embed Tagh3> <embed>cos> html>>></pre> </code> <p dir='ltr'> <b> <strong>Sortida:</strong> </b> </p> <img src='//techcodeview.com/img/geeks-premier-league-2022/50/how-embed-pdf-file-using-html.webp' alt=""> <br> <br></article>
</div><!--//content-->
</div><!--//section-inner-->
</section><!--//section-->
</div><!--//primary-->
<div class="secondary col-md-4 col-sm-12 col-xs-12">
<aside class="info aside section">
<div class="section-inner">
<h2 class="">Categoria</h2>
<div class="content">
<ul class="list-unstyled">
<li> <a href="/factors/">Factors De</a> </li><li> <a href="/exception-handling/">Tractament D'excepcions</a> </li><li> <a href="/bitwise-operators/">Operadors Per Bits</a> </li><li> <a href="/csharp-dictionary-class/">Classe De Diccionari Csharp</a> </li><li> <a href="/programs/">Programes</a> </li><li> <a href="/log4j-tutorial/">Tutorial Log4J</a> </li><li> <a href="/json/">Json</a> </li><li> <a href="/cricket/">Cricket</a> </li><li> <a href="/cpp-pointer/">Punter Cpp</a> </li><li> <a href="/jpa-tutorial/">Tutorial Jpa</a> </li>
</ul>
</div><!--//content-->
</div><!--//section-inner-->
</aside><!--//aside-->
<aside class="testimonials aside section">
<div class="section-inner">
<h2 class="heading">Full de trucs de Git</h2>
<div class="content">
<div class="item">
<blockquote class="quote">
<span> <i class="fa fa-quote-left"></i> Full de trucs complet de Git: una guia ràpida de trampes de Git plena d'ordres i consells essencials de Git. Perfecte per a desenvolupadors principiants i experimentats.</span>
</blockquote>
</div><!--//item-->
<p> <a class="more-link" href="/git-cheat-sheet"> <i class="fa fa-external-link"></i> Llegir Més</a> </p>
</div><!--//content-->
</div><!--//section-inner-->
</aside><!--//section-->
<aside class="languages aside section">
<div class="section-inner">
<h2 class="heading">Articles D'Interès</h2>
<div class="content">
<ul class="list-unstyled">
<li class="item">
<span class="title"> <strong> <a href="/advantages-disadvantages-television">Avantatges i inconvenients de la televisió</a> </strong> </span>
</li><!--//item--><li class="item">
<span class="title"> <strong> <a href="/stream-flatmap-java-with-examples">Transmet flatMap() en Java amb exemples</a> </strong> </span>
</li><!--//item--><li class="item">
<span class="title"> <strong> <a href="/es6-cat/">Es6</a> </strong> </span>
</li><!--//item--><li class="item">
<span class="title"> <strong> <a href="/how-check-how-many-cpus-are-there-linux-system">Com comprovar quantes CPU hi ha al sistema Linux</a> </strong> </span>
</li><!--//item--><li class="item">
<span class="title"> <strong> <a href="/ios-development/">Desenvolupament Ios</a> </strong> </span>
</li><!--//item-->
</ul>
</div><!--//content-->
</div><!--//section-inner-->
</aside><!--//section-->
<aside class="list music aside section">
<div class="section-inner">
<h2 class="heading">Entrades Populars</h2>
<div class="content">
<ul class="list"> <li><a href="/reference-data-types-java">tipus de referència java</a>
</li><li><a href="/armstrong-number-c">nombre d'armstrong</a>
</li><li><a href="/java-string-equals">és igual a una cadena en java</a>
</li><li><a href="/linux-file-system">sistema de fitxers a linux</a>
</li><li><a href="/java-file-extension">fitxer d'extensió java</a>
</li>
</ul>
</div><!--//content-->
</div><!--//section-inner-->
</aside><!--//section-->
</div><!--//secondary-->
</div><!--//row-->
</div><!--//masonry-->
<footer class="footer">
<div class="container text-center">
<span>
Copyright ©2025 Tots Els Drets Reservats | <a href="//uk.techcodeview.com/">techcodeview.com</a> | <a href="/disclaimer" rel="nofollow noopener noreferrer" target="_blank">Exempció De Responsabilitat</a> | <a href="/about-us" rel="nofollow noopener noreferrer" target="_blank">Sobre Nosaltres</a> | <a href="/privacy-policy" rel="nofollow noopener noreferrer" target="_blank">Política De Privadesa</a> </span>
</div>
</footer>
<script type="text/javascript" src="https://techcodeview.com/template/assets/plugins/jquery-1.11.3.min.js"></script>
<script type="text/javascript" src="https://techcodeview.com/template/assets/plugins/bootstrap/js/bootstrap.min.js"></script>
<script type="text/javascript" src="https://techcodeview.com/template/assets/js/main.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/11.5.1/highlight.min.js"></script>
</body>
</html>