- Data Structure
- Networking
- RDBMS
- Operating System
- Java
- MS Excel
- iOS
- HTML
- CSS
- Android
- Python
- C Programming
- C++
- C#
- MongoDB
- MySQL
- Javascript
- PHP
- Physics
- Chemistry
- Biology
- Mathematics
- English
- Economics
- Psychology
- Social Studies
- Fashion Studies
- Legal Studies
- Selected Reading
- UPSC IAS Exams Notes
- Developer's Best Practices
- Questions and Answers
- Effective Resume Writing
- HR Interview Questions
- Computer Glossary
- Who is Who
Recommended way to embed PDF in HTML?
To embed a PDF in HTML is an easy task and there are various ways. Let us see them one by one.
- Embed PDF in HTML using iframe.
- Embed PDF in HTML using the embed tag.
- Embed PDF in HTML using the object tag.
Embed PDF in HTML using iframe
Set the src attribute of the iframe tag and add the link of the PDF to embed −
<iframe src="https://www.tutorialspoint.com/python3/python3_tutorial.pdf" width="700" height="500"> </iframe>
Example
Let us now see an example to ember PDF using <iframe> −
<!DOCTYPE html> <html> <head> <title>Embed PDF</title> </head> <body> <center> <h1>Python by Tutorialspoint</h1> <p>Below is a preview of the Python Tutorial:</p> <iframe src="https://www.tutorialspoint.com/python3/python3_tutorial.pdf" width="700" height="500"> </iframe> </center> </body> </html>
Output
Embed PDF in HTML using the embed tag
We can also embed PDF using the <embed> tag −
<embed src="https://www.tutorialspoint.com/java/java_tutorial.pdf" width="700" height="500">
Example
Let us now see an example to embed PDF using the embed tag −
<!DOCTYPE html> <html> <head> <title>Embed PDF</title> </head> <body> <center> <h1>Java by Tutorialspoint</h1> <p>Below is a preview of the Java Tutorial:</p> <embed src="https://www.tutorialspoint.com/java/java_tutorial.pdf" width="700" height="500"> </center> </body> </html>
Output
Embed PDF in HTML using the object tag
We can embed PDF using the <object> tag. The data attribute of the object data is where you need to place the link of the PDF file to be embedded −
<object data="https://www.tutorialspoint.com/android/android_tutorial.pdf" width="700" height="500">
Example
Let us now see an example to embed PDF using the object tag −
<!DOCTYPE html> <html> <head> <title>Embed PDF</title> </head> <body> <center> <h1>Android by Tutorialspoint</h1> <p>Below is a preview of the Android Tutorial:</p> <object data="https://www.tutorialspoint.com/android/android_tutorial.pdf" width="700" height="500"> </center> </body> </html>
Output
Advertisements