일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | 6 | 7 |
8 | 9 | 10 | 11 | 12 | 13 | 14 |
15 | 16 | 17 | 18 | 19 | 20 | 21 |
22 | 23 | 24 | 25 | 26 | 27 | 28 |
29 | 30 | 31 |
- Virtual Box
- Mysql c API
- Arduino
- database
- MySQL
- 아두이노
- HTML
- Arduino pin
- 웹 프로그래밍
- 데이터베이스
- 라즈베리파이
- web
- 아두이노 핀 맵
- 알고리즘
- 아두이노 wifi
- mysql c
- 아두이노 프로미니
- Arduino pin map
- mysql api
- Codility
- 코딜리티
- 아두이노 pro mini
- html input
- Raspberry Pi
- 아두이노 핀맵
- 아두이노 핀
- wifi멀티탭
- 아두이노 와이파이
- vm
- ubuntu
- Today
- Total
offfff
HTML iframes 본문
HTML Iframes
iframe은 웹페이지 안에 웹페이지를 출력하는데 사용된다.
Iframes Syntax
HTML iframe은 <iframe> 태그로 정의된다.
src 속성에 웹페이지의 주소를 값으로 적는다.
<iframe src="URL"></iframe>
Iframes - Set Height and Width
height와 width 속성을 사용해서 ifame의 높이와 폭을 결정할 수 있다.
속성값은 기본적으로 픽셀단위로 취급되고, %단위도 사용할 수 있다.
<!DOCTYPE html>
<html>
<body>
<ifame src="http://dk-projects.tistory.com" height="100%" width="300"></iframe>
</body>
</html>
Iframes - Remove the Border
기본적으로 iframe은 테두리를 가지고 있다.
테두리를 없애고 싶으면, style 속성을 추가하거나 CSS border 속성을 사용해서 없앨 수 있다.
<!DOCTYPE html>
<html>
<body>
<ifame src="http://dk-projects.tistory.com" style="border:none;"></iframe>
<ifame src="http://dk-projects.tistory.com" style="border:2px solid grey;"></iframe>
</body>
</html>
Iframes - Target for a Link
링크를 클릭했을 때, 새 창이나 탭에서 열거나, 현재 페이지에서 해당 주소로 이동하게 된다.
그런데 iframe을 사용하면, 링크를 클릭했을 때, 프레임에서 해당 주소 페이지를 띄우도록 할 수 있다.
링크의 target 속성과 iframe의 name 속성을 응용하면 된다.
<!DOCTYPE html>
<html>
<body>
<ifame src="http://dk-projects.tistory.com" name="iframe_a"></iframe>
<p><a href="www.naver.com" target="iframe_a">네이버 열기</a></p>
<p><a href="http://dk-projects.tistory.com" target="iframe_a">블로그 열기</a></p>
</body>
</html>
아래 링크를 참조하여 번역 및 수정 함
http://www.w3schools.com/html/html_iframe.asp
'프로그래밍' 카테고리의 다른 글
HTML 헤더(HTML Head) (0) | 2016.09.10 |
---|---|
HTML 자바스크립트(HTML JavaScript) (0) | 2016.09.09 |
HTML Classes (0) | 2016.09.07 |
HTML 블록(HTML Blocks) (0) | 2016.09.06 |
HTML 리스트(HTML Lists) (0) | 2016.09.05 |