개발 공부 기록하기

[생활코딩] 14강. <iframe> 본문

프밍/HTML

[생활코딩] 14강. <iframe>

태영(泰伶) 2022. 10. 8. 00:07

<iframe>

페이지 안에 페이지를 삽입하는 기법.

나머지는 생활코딩의 HTML 수업 페이지의 영역인데 비해, 파란색 네모 부분은 Youtube의 영역이다.

 

<iframe src="불러올 웹페이지의 URL" scrolling="스크롤링 허용 여부(yes/no/auto)">

           iframe을 지원하지 않는 아주 오래된 브라우저인 경우 대체정보 제공

</iframe>

 

 

src 불러올 웹페이지의 URL source의 약자.
scrolling="auto" 스크롤링 필요한 경우만 스크롤바 노출. default 값임.  
scrolling="yes" 스크롤링 허용. 스크롤링 핑요 없어도 스크롤 바 노출됨.  
scrolling="no" 스크롤링 허용 안 함. 잘려서 보일 수 있고 스크롤링 할 수 있는 방법이 없어짐.  
width iframe의 너비 iframe의 속성으로 제어할 수는 있으나, CSS로 제어하는 것이 권장됨.
height iframe의 높이
frameborder iframe의 테두리 사용 여부

 

예제.

<!DOCTYPE html>
	<html>
		<body>
			<iframe src="https://opentutorials.org" width="90%" height="300" frameborder="1" scrolling="yes">
			</iframe>
		</body>
	</html>

↓

코드가 어떤 화면으로 나오는지 임의로 저장한 파일(_.html)을 실행시켰다.

 

저작자표시 비영리 변경금지

'프밍 > HTML' 카테고리의 다른 글

[생활코딩] 16강. 표 <table>, <tr>, <td>, <th>  (0) 2022.10.11
[생활코딩] 15강. 이스케이핑(escaping)  (0) 2022.10.09
[생활코딩] 13강. 목록 만들기 <ul>, <ol>, <li>  (0) 2022.10.04
[생활코딩] 12강. 이미지 <img>  (0) 2022.10.02
[생활코딩] 11강. 띄어쓰기 &nbsp;  (0) 2022.10.02
'프밍/HTML' Related Articles more
Comments