HTML에 PDF 포함

1. embed 태그를 사용하여 HTML에 PDF 포함
2. iframe 태그를 사용하여 HTML에 PDF 포함
3. object 태그를 사용하여 HTML에 PDF 포함

이 자습서에서는 HTML에 PDF를 포함하는 방법을 소개합니다.

embed 태그를 사용하여 HTML에 PDF 포함

HTML은 웹페이지에 외부 리소스를 포함하는 embed 태그를 제공합니다. embed 태그를 사용하여 PDF, 미디어 플레이어, 웹 페이지 등과 같은 외부 리소스를 포함할 수 있습니다. 태그에는 포함할 파일의 경로를 제공할 수 있는 src 속성이 있습니다. type 속성을 사용하여 포함된 파일의 유형을 지정할 수 있습니다. PDF의 경우 type 속성은 application/pdf여야 합니다. embed 태그는 자동 닫히는 태그입니다.

예를 들어, HTML 파일이 있는 디렉토리에 files라는 파일을 작성하십시오. files 파일 안에 PDF husky.pdf가 있습니다. HTML에서 embed 태그를 작성하고 src 속성에 files/husky.pdf 경로를 지정합니다. 그런 다음 type 속성을 application/pdf로 설정합니다. 100%의 PDF 너비와 높이를 지정합니다.

아래 예는 웹페이지에 husky.pdf PDF를 생성합니다. 높이와 너비가 100%로 설정되면 PDF가 뷰포트를 덮습니다.

embed 태그는 모든 최신 브라우저에서 지원되지 않을 수 있습니다. Android Chrome 브라우저는 PDF 포함을 지원하지 않습니다. 이러한 경우 Google 드라이브 PDF 뷰어를 사용할 수 있습니다. type 속성을 제거하고 PDF의 Google 드라이브 URL을 설정해야 합니다. 이런 식으로 HTML에 PDF를 포함할 수 있습니다.

예제 코드:

<embed src="files/husky.pdf" type="application/pdf" width="100%" height="100%" />

iframe 태그를 사용하여 HTML에 PDF 포함

iframe HTML 태그를 사용하면 HTML 파일에 다른 문서를 포함할 수 있습니다. HTML에 PDF를 포함하는 데 사용할 수 있습니다. src 속성에서 PDF 파일의 경로를 지정할 수 있습니다. 태그 내에서 PDF의 높이와 너비를 설정할 수 있습니다.

예를 들어 iframe 태그를 작성하고 src 속성을 files/husky.jpg로 설정합니다. Husky.jpg는 files 디렉토리에 있는 포함할 PDF 파일입니다. HTML 파일과 files 디렉토리는 같은 디렉토리에 있습니다. PDF의 높이와 너비를 100%로 설정합니다. PDF는 뷰포트를 덮을 것입니다. iframe 태그를 사용하면 PDF에 세로 스크롤 막대가 제공됩니다. 이런 식으로 iframe 태그를 사용하여 HTML에 PDF 파일을 포함할 수 있습니다.

예제 코드:

<iframe src="files/husky.pdf" height="100%" width="100%"></iframe>

object 태그를 사용하여 HTML에 PDF 포함

object 태그를 사용하여 HTML에 PDF를 포함할 수도 있습니다. object 태그는 외부 리소스가 사용할 컨테이너를 설정합니다. 외부 리소스는 PDF, 미디어, 웹페이지 등이 될 수 있습니다. data 속성에서 파일의 경로를 설정할 수 있습니다. 마찬가지로 위의 방법과 마찬가지로 태그 자체에서 컨테이너의 높이와 너비를 설정할 수 있습니다. 따라서 object 태그를 사용하여 HTML에 PDF를 포함할 수 있습니다.

예제 코드:

<object data="files/husky.pdf" height="100%" width="100%"></object>