각진 세상에 둥근 춤을 추자
[HTML] 아이프레임과 target 본문
아이프레임은 프레임의 일종으로 프레임 중에서 문서 본문에 액자처럼 삽입하는 것을 말한다.
<iframe>을 이용해 현재 문서에 다른 문서를 포함시키거나, 자바스크립트를 이용해 팝업 창을 열도록 했을 때
현재 문서는 부모 문서가 되고, <iframe>으로 삽입된 문서와 팝업 문서는 자식 문서가 된다.
예제를 통해 아이프레임과 target에 대해 이해해 본다.
parent.html 문서 안에 <iframe> 태그를 이용해 child.html 문서를 삽입한 후 홈페이지를 링크한다.
이때, "target=" _top"으로 지정하면 프레임을 벗어나 브라우저 창 전체에 링크 내용이 표시된다.
먼저 parent.html 문서를 작성한다.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>parent</title>
</head>
<body>
<h3>Parent</h3>
<iframe src="child.html" width="600" height="400"></iframe>
</body>
</html>
그리고 삽입할 child.html 문서를 작성한다.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>child</title>
</head>
<body>
<h3>Child</h3>
<p>
<a href="https://comic.naver.com/index" target="_top">네이버 웹툰 보기(전체 화면)</a>
</p>
</body>
</html>
'HTML' 카테고리의 다른 글
| [HTML] <input> 태그와 타입 (0) | 2022.09.27 |
|---|---|
| [HTML] 폼 만들기 (0) | 2022.09.27 |
| [HTML] 링크 태그 (0) | 2022.09.22 |
| [HTML] 이미지 태그 (0) | 2022.09.22 |
| [HTML] 표 태그 (0) | 2022.09.22 |
'HTML' Related Articles
more
