[HTML] iframe
- IT/HTML
- 2020. 4. 30.
iframe을 이용한 문서 삽입
html에서 iframe 이라는 태그를 이용하면 현재 페이지 안에 또 다른 페이지를 넣을 수 있습니다.
아이프레임은 프레임의 일종으로 프레임 중에서 문서 본문에 액자처럼 삽입하는 것을 말합니다. Iframe을 이용해 또 다른 페이지를 삽입 했을 때 현재 문서는 부모 문서가 되고 삽입된 문서는 자식 문서가 됩니다.
실습
Iframe 태그를 실습하기 위해 간단한 부모 문서와 자식 문서부터 만들어 보겠습니다.
부모 문서(Parent.html)
<body>
<h1>iframe 예제</h1>
<p>아래 화면은 iframe 태그를 이용해 외부 문서를 현재 문서에 삽입한 것입니다.</p>
<br><br>
<iframe src="blank.html" width="600" height="400"></iframe>
</body>
자식 문서(Child.html)
<body>
<img src="images\google.png" alt="Google 로고">
<br><br>
<h2>iframe child</h2>
</body>
이제 iframe 태그를 사용하여 이 Child.html을 Parent.html의 일부 화면에 보이도록 하겠습니다.
iframe을 이용한 문서 삽입
<body>
<h1>iframe 예제</h1>
<p>아래 화면은 iframe 태그를 이용해 외부 문서를 현재 문서에 삽입한 것입니다.</p>
<br><br>
<iframe src="Child.html" width="600" height="400"></iframe>
</body>
'IT > HTML' 카테고리의 다른 글
| [HTML] 자동 완성 기능 - autocomplete (0) | 2020.05.06 |
|---|---|
| [HTML] SVG 이미지 (0) | 2020.04.30 |
| [HTML] <meta> 태그 (0) | 2020.04.28 |
| [HTML] HTML 기본구조 (0) | 2020.04.27 |
| [HTML] HTML 이란? (0) | 2020.04.24 |