본문 바로가기
KDT/HTML | CSS

아이프레임(iframe)

by jhwannabe 2023. 3. 24.
  • inline frame의 약자
  • 웹사이트 안에 또 다른 웹사이트를 삽입
<iframe src='삽입할 페이지의 주소 또는 문서 위치' style='크기를 설정할 css 코드'></iframe>

 

target 속성

  • _blank: 새탭에서 열림
  • 아이프레임의 name: 해당 아이프레임에서 열림

예제 코드

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>아이프레임</title>
</head>
<body>
    <h2>아이프레임</h2>
    <p>
        <a href="7. 하이퍼링크.html">하이퍼링크 연습 페이지(현재 페이지)</a>
        <a href="7. 하이퍼링크.html" target="_blank">하이퍼링크 연습 페이지(새 탭)</a>
        <a href="7. 하이퍼링크.html" target="if">하이퍼링크 연습 페이지(아이프레임)</a>
    </p>
    <p>
        <iframe src="http://www.koreaitacademy.co.kr" style="width: 100%; height: 800px; border: 3px dashed rgb(43, 223, 43);" name="if"></iframe>
    </p>
</body>
</html>

728x90
반응형

'KDT > HTML | CSS' 카테고리의 다른 글

HTML의 디스플레이  (0) 2023.03.27
폼 태그  (0) 2023.03.24
테이블 만들기  (0) 2023.03.24
책갈피  (0) 2023.03.24
하이퍼링크(HyperLink)  (1) 2023.03.24