HTML공부 iframe

HTML 2011. 7. 27. 21:50


  안녕하세요?
  지난번에는 프레임을 사용해서 메뉴프레임과 메인프레임으로 나눠서 링크를 누르면 메인프레임에 그 링크가 가리키는 문서를 나타내게 하는 것을 배워보았습니다. 오늘은 iframe에 대해서 배워보겠습니다. iframe은 일종의 frame인데 문서 중간에 들어가는 프레임입니다.


  위의 사진에서 중간에 스크롤바가 있는 네모난 곳이 IFRAME입니다. 문서가 너무 길때 중간에 이렇게 IFRAME으로 문서를 넣으면 편리하겠죠? 
  그럼 위의 IFRAME이 들어간 문서는 어떤 모양일까요? 먼저 IFRAME을 선언하는 문서가 있어야하고 그 IRAME에 들어갈 문서가 있어야 겠지요. 그전에 IFRAME의 형식은 FRAME의 형식과 똑같습니다

<iframe src="iframe_main.html" width=500 height=100 name="iframe"></iframe>

  이런식으로 하시면 됩니다. 이말은 iframe을 선언하는데 src즉 그 안에 들어갈 문서는 iframe_main.html이고 width 너비는 500픽셀, height 높이는 100픽셀 별칭은 iframe으로 한다는 것입니다. 별칭이 있으니 문서어디서라도 참조가 가능하겠죠? 예를들어

<a href=http://www.naver.com target="iframe"></a>

  이렇게하면 네이버로 가는 링크가 걸려있으므로 이것을 클릭하면 iframe안에 네이버가 뜨게 될겁니다. 그럼 iframe선언 문서부터 소스코드를 보시죠.

<html>
<head><title>IFRAME</title>
</head>
<body>
<p>IFRAME 예제
<p>이 문서 중간에 IFRAME이 삽입되었습니다.
<p><iframe src="iframe_main.html" width=500 height=100 name="iframe"></iframe>
<br>이위가 IFRAME입니다.<br>
</body>
</html>

  중간에 iframe들어간 부분 보이시죠?
  그다음에 iframe안에 들어간 문서입니다.

<html>
<head><title></title>
</head>
<body>
<p>이 안이 IFRAME입니다.
<p>
<p>죽는 날까지 하늘을 우러러...
<p>한점 부끄럼없기를...
</body>
</html>

  대충 이해가 가셨으리라 생각합니다. 문서중간에 들어가는 프레임이라고 생각하시면 되겠습니다.
  이것으로써 html기초부분을 마치겠습니다. 그럼 다음시간에 또 만나요~

'HTML' 카테고리의 다른 글

input태그와 간단한 로그인 박스 만들기  (0) 2011.08.08
HTML태그정리표  (0) 2011.08.03
frame 제어  (0) 2011.07.26
frame기본  (0) 2011.07.25
셀의 정렬속성  (0) 2011.07.21


설정

트랙백

댓글