임베디드 요소-video, audio, canvas, iframe

video : 비디오 삽입 요소

   > video 태그는 태그 내에 값을 넣을수 있으며, 비디오가 정상적으로 나오지 않을경우 태그 내의 값이 나온다.

      - 보통 브라우저가 영상파일을 지원하지 않을때를 대비해서 사용한다.

   >  src 속성을 통해 비디오 파일 경로를 지정한다.

   > src 속성이 옵셔널이며, source 태그를 자식 태그로 넣어 사용할 수도 있다.

 

   - controls 속성 : video 태그 내 컨트롤 패널을 추가해 줄 수 있다.

   - autoplay 속성 : 첫 실행 시 자동실행을 시킨다. 사운드플레이 옵션때문에 새로고침시 재생이 멈출수도 있다.

   - muted 속성 : 음소거, 설정시 새로고침을 하더라도 autoplay 속성이 실행된다. 

   - loop 속성 : 속성 추가시 영상이 끝난 뒤 처음부터 반복시킨다.

   - poster 속성 : 이미지 경로를 지정하여 설정하며, 영상 섬네일을 설정할 수 있다.

 

audio : 소리 콘텐츠를 포함할 때 사용한다.

   > video 태그와 대부분의 속성을 공유한다.

   > src 속성이 옵셔널이며, source 태그를 자식 태그로 넣어 사용할 수도 있다.

 

 

!!! autoplay를 통해 갑자기 비디오나 사운드를 틀어주는 사이트는 UX 측면으로 악영향을 끼칠 수도 있다.

   따라서 autoplay속성을 넣는것은 피하는 것이 좋으며, 넣는다면 muted 속성을 함께 넣는것이 좋다.

   > control 속성을 넣어주는것이 좋다.

 

 

canvas : 캔버스 스크립팅 API 또는 WebGLAPi와 함께 사용하여 그래픽과 애니메이션 등을 그릴수 있다.

   > JavaScript를 함께 사용하여야 한다.

 

iframe : 인라인 프레임 요소, 현재 문서 안에 다른 HTML 페이지를 삽입한다.

   > 주로 지도를 삽입할때 사용한다.