Embedding Pdf file in Html (Without JavaScript)
In this tutorial, we are going to learn about how to embed and view pdf files in Html with the help of a demo.
Object element
In html, we have the <object> element by using that we can embed our pdf file in html without any third-party libraries.
Embedding pdf
This example shows you how to embed pdf file in html using <object> element.
- Grab your pdf file link.
- Add
typeattribute with valueapplication/pdftoobjectelement. - Add
dataattribute with valueyour pdf linktoobjectelement. - Set
heightandwidthaccording to your requirements.
<!DOCTYPE html>
<html>
<head>
<title>Embedding pdf</title>
</head>
<body>
<h1>My pdf</h1>
<object
type="application/pdf"
data="https://gahp.net/wp-content/uploads/2017/09/sample.pdf"
width="600"
height="700"
>
</object>
</body>
</html>Output
Demo
- Share:
