video 태그로 웹에 동영상 넣기

 

html5는 기존의 html보다 미디어컨텐츠 및 애니메이션에 특화되었는데요.
그 중 대표적인 태그가 video 태그입니다.
video 태그 기본 설정은 아래와 같습니다.

<video src="경로">
<video src="경로" autoplay loop>

 

 

 

위 기본태그에 옵션값을 넣으면 컨트롤러 및 재생을 설정할 수 있습니다.

옵션에는 controls, autoplay, loop, poster, width, height, preload="none", preload="metadata", preload="auto"   등이 있으며 자세한 설명은 아래는 하단에 정리해 놨으니 참고바랍니다.

controls	미디어에 컨트롤러 표시
autoplay	비디오, 오디오를 다운로드 하자마자 재생
loop	무한 반복 재생 (loop="3" 이라고 쓰면 3번 반복)
poster	동영상이 화면에 나타나지 않을 때 표시되는 이미지
width	가로길이
height	세로길이
preload="none"	재생 시 파일 다운로드
preload="metadata"	메타 정보만 받음
preload="auto"	웹페이지 여는 순간 바로 다운로드 (기본값)

 

 

 

마지막으로 오디오파일은 확장자에 따라서 지원하는 브라우저가 있으니까 아래 표를 보고 오디오 파일을 제작하시길 바랍니다.