글
frame 제어
HTML
2011. 7. 26. 20:50
안녕하세요?
지난번에는 frame의 기본에 대해서 배웠습니다. 오늘은 프레임을 제어하는 것으로 왼쪽 메뉴프레임에서 링크를 눌렀을때 오른쪽에 그 링크에 해당하는 화면이 나오도록 하는 것입니다. 예전에는 보통 이런식으로 문서를 만들었지요.
예를들어 위와 같은 경우지요. 왼쪽 프레임에는 메뉴가 나오고 오른쪽에는 그 메뉴를 눌렀을때 그 메뉴페이지로 이동하는 겁니다. 위에서는 네이버를 누르면 오른쪽에 네이버로 가는거지요. 그럼 이런것은 어떻게 만들끼요? 먼저 프레임셋을 정해줍니다.
<html>
<head>
<title>FRAME</title>
</head>
<frameset cols=200,*>
<frame src="menu.html" name="menu">
<frame src="main.html" name="main">
</frameset>
</html>
이건 앞에서 배우셨죠? 왼쪽 프레임은 menu.html이 오른쪽 프레임은 main.html이 불려져 올겁니다. 그다음에 왼쪽 menu.html에 위의 그림과 같이 네이버,다음,야후 이렇게 메뉴를 적어주고 오른쪽 main.html에는 위에 나오는 글자를 출력해 주면 되겠지요.
<html>
<head><title>MENU Frame</title>
</head>
<body>
<p><a href="http://www.naver.com" target="main">네이버</a></p>
<p><a href="http://www.daum.net" target="main">다음</a></p>
<p><a href="http://www.yahoo.co.kr" target="main">야후</a></p>
</body>
</html>
- menu.html입니다.
<html>
<head><title>MAIN FRAME</title>
</head>
<body>
<p>왼쪽을 누르면 여기에 네이버,다음,야후로 이동합니다.</p>
</body>
</html>
- main.html입니다.
우리가 이때까지 안배운것중에 위에 menu.html에 target이 있습니다. 이것은 그 별칭으로 링크를 보내라는 뜻입니다. 여기서는 target="main" 이니깐 main이라는 이름을 가진 오른쪽 프레임으로 링크를 보내라는 겁니다. 이해하시겠지요? 그러니깐 네이버를 누르면 오른쪽 main프레임에 그 링크 즉 http://www.naver.com으로 이동한 페이지가 표시된다는 겁니다. 그렇게 하면 네이버를 눌렀을때는
다음을 눌렀을때는
야후를 눌렀을때는
이렇게 됩니다. 이해하셨죠? 좀 더 멋진 홈피을 이제 만들 수 있을거 같지 않습니까? 그럼 다음시간에는 iframe에 대해서 배워보도록 하겠습니다. 그럼 이만~
'HTML' 카테고리의 다른 글
| HTML태그정리표 (0) | 2011.08.03 |
|---|---|
| HTML공부 iframe (2) | 2011.07.27 |
| frame기본 (0) | 2011.07.25 |
| 셀의 정렬속성 (0) | 2011.07.21 |
| 표의 경계선, 너비와 높이조절 (0) | 2011.07.19 |
