내장 콘텐츠

1. <iframe> </iframe>

• 다른 HTML 페이지를 현재 페이지에 삽입할 수 있는 태그입니다(display: inline;).

• 해당 태그는 다른 페이지의 동영상 콘텐츠를 가져와서 현재 페이지 삽입할 때 자주 사용됩니다.

속성	의미	값
🔑 src	포함할 문서의 URL	URL
frameborder	프레임 테두리 사용 여부	0, 1(기본값)
allowfullscreen	전체화면 모드 사용 여부	불린속성
name	프레임의 이름
width	프레임 가로 너비
height	프레임 세로 너비
sandbox	보안을 위한 읽기 전용으로 삽입 여부	불린속성: 읽기 전용으로 삽입, allow-form: 양식제출 허용, allow-scripts: 스크립트 사용 허용, allow-same-origin: 같은 출처(도메인)의 리소스만 사용 가능

• src 속성으로 포함될 문서의 URL을 작성합니다.

• frameborder 속성은 프레임의 테두리 사용 여부를 명시합니다. 기본값은 1로 테두리를 사용한다고 설정되어 있으며 0을 지정하면 테두리를 없앨 수 있습니다.

• allowfullscreen 속성을 작성하면 전체 화면 모드를 설정합니다.

• name 속성으로 프레임의 이름을 작성할 수 있습니다. 프레임이 여러 개 존재한다면 name 속성으로 프레임의 고유한 이름을 설정할 수 있습니다.

• width, heigth 속성으로 프레임의 가로, 세로 너비를 지정할 수 있습니다.

• sandbox 속성으로 보안을 강화할 수 있습니다. 하지만 기본적인 내용들을 사용하지 못할 수 있습니다. 불린 값을 사용하면 읽기 전용을 삽입

  • allow-form 값을 작성하면 양식을 제출하는 것을 허용
  • allow-scripts 값은 자바스크립트를 실행 가능하도록 설정
  • allow-same-origin 값은 같은 출처(도메인)의 리소스만 사용이 가능

2. <canvas> </canvas>

• Cansvas API나 WebGL API를 사용하여 그래픽이나 애니메이션을 렌더링할 영역을 설정합니다(display: inline;).

• 속성	의미	값
  width	Canvas의 가로 너비
  height	Canvas의 세로 너비