[웹퍼블리싱_html/css] iframe 태그 사용법

iframe은 웹 사이트 안에, 페이지를 발췌하여 가져오는 것입니다.

기본적으로 inline 형식을 갖습니다.

 

기본 형식

<iframe scr="링크명"></iframe>

 

 

1. 다른 hmtl 문서 삽입 

<iframe src="파일명.html" width="300" height="150"></iframe>

 

2. 다른 웹사이트 표시

<iframe src="https://www.daum.net/" width="300" height="150"></iframe>
<iframe src="https://www.google.com/" width="300" height="150"></iframe>

 

*** naver는 불러오기가 불가능합니다.

위와 같이 홈페이지 소유자 측에서 권한을 막을 수도 있습니다.

 

3. 링크 <a> 태그를 사용하여, 열리는 문서 지정

<iframe src="" name="aaa"></iframe>
<a href="http://www.w3c.org" target="aaa">웹 공식 사이트</a>

*** 위의 방식은, javascript의 function을 사용하여 불러오기 위한 방법으로 많이 쓰이고 있습니다.

 

+ iframe 경계선 제거

iframe은 기본적으로 위와 같은 경계선이 있습니다.

미적으로도 보기에 좋지 않고, 홈페이지에 불필요한 부분이므로 속성을 사용하여 제거해주는 것이 좋습니다.

 

<iframe src="링크명" frameborder="0"></iframe>

 

iframe 속성 뒤에, frameborder="0"을 사용하면, 경계선이 없어집니다.

 

 

>> 실행화면 (예시)

iframe을 두 개 설정 시, 나오는 화면