공부 참고 : http://tcpschool.com/html/html_space_framesIframes
▶ iframe 요소
▣ iframe 요소
- inline frame의 약자
- 해당 웹 페이지 않에 제한 없이 또다른 하나의 웹 페이지 삽입 가능.
- 문법 : <iframe src="삽입할 페이지 주소"></iframe>
- 크기를 명시할 수 있음.
- 결과 화면
▣ iframe 요소의 테두리 변경
- 기본적으로 검정색 테두리를 가짐.
- style속성을 통해 변경 가능.
- 결과 화면
- iframe 테두리를 없애기 위해서는 border 속성값을 none으로 설정하면 됨.
▣ iframe 요소의 페이지 변경하기
- <a> 태그를 이용하면 iframe 요소의 최초 페이지를 중간에 바꿀 수 있음.
- <a> 태그의 target 속성과 iframe 요소의 name 속성을 연결.
- 결과 화면
▣ 프레임셋(frameset)
- 프레임셋을 이용하면 하나의 브라우저 창에 둘 이상의 페이지를 표시가능.
- iframe 요소는 하나의 페이지만 표시.
- noresize 속성을 명시하지 않으면 사용자가 마음대로 페이지의 크기를 조절가능.
- iframe 요소와 달리 frame 요소는 종료태그를 가지지 않음.
- noframes 요소는 해당 브라우저가 frame 요소를 지원하지 않을 때 보여지는 문자열 저장.
- frameset, frame, noframes 요소는 HTML5 표준 권고안에서 지원하지 않음.
☞ iframe 요소 또는 CSS 이용하자.
▣ 수직 프레임셋
- 하나의 브라우저 창을 세로 방향으로 분리하여 표현
<frameset cols="25%,*,25%">
<frame name="left" src="/html/intro"/>
<frame name="center" src="/css/intro"/>
<frame name="right" src="/php/intro"/>
<noframes>
<body> 이 브라우저는 frame태그를 지원하지 않습니다! </body>
</noframes>
</frameset>
▣ 수평 프레임셋
- 하나의 브라우저 창을 가로 방향으로 분리하여 표현
- noresize 속성을 명시하였으므로, 사용자가 창의 크기를 조절할 수 없음.
<frameset rows="20%,60%,20%">
<frame name="top" src="/html/intro" noresize="noresize" />
<frame name="center" src="/css/intro" noresize="noresize" />
<frame name="bottom" src="/php/intro" noresize="noresize" />
<noframes>
<body>
이 브라우저는 frame태그를 지원하지 않습니다!
</body>
</noframes>
</frameset>
'WEB > HTML' 카테고리의 다른 글
| [HTML 입력 양식] input 요소의 속성 (0) | 2017.06.29 |
|---|---|
| [HTML 입력 양식] form 요소 (0) | 2017.06.29 |
| [HTML 공간 분할] 블록과 인라인 (0) | 2017.06.23 |
| [HTML 기본 요소] 테이블 (0) | 2017.06.22 |
| [HTML 기본 요소] 이미지 (0) | 2017.06.22 |
