HTML <비디오> 태그


예시

동영상 재생:

<video width="320" height="240" controls>
  <source src="movie.mp4" type="video/mp4">
  <source src="movie.ogg" type="video/ogg">
  Your browser does not support the video tag.
</video>

정의 및 사용

<video>태그는 동영상 클립이나 기타 비디오 스트림과 같은 문서에 비디오 콘텐츠를 포함하는 데 사용됩니다 .

태그에는 비디오 소스가 다른 <video>하나 이상의 태그가 포함되어 있습니다 . <source>브라우저는 지원하는 첫 번째 소스를 선택합니다.

<video>와 태그 사이의 텍스트 </video> 는 <video> 요소를 지원하지 않는 브라우저에서만 표시됩니다.

HTML에는 MP4, WebM 및 OGG의 세 가지 지원되는 비디오 형식이 있습니다.

Browser MP4 WebM Ogg
Edge YES YES YES
Chrome YES YES YES
Firefox YES YES YES
Safari YES YES NO
Opera YES YES YES

팁 및 참고 사항

팁: 오디오 파일의 경우 태그를 확인하세요. <audio>



브라우저 지원

표의 숫자는 요소를 완전히 지원하는 첫 번째 브라우저 버전을 지정합니다.

Element
<video> 4.0 9.0 3.5 3.1 11.5

선택적 속성

Attribute Value Description
autoplay autoplay Specifies that the video will start playing as soon as it is ready
controls controls Specifies that video controls should be displayed (such as a play/pause button etc).
height pixels Sets the height of the video player
loop loop Specifies that the video will start over again, every time it is finished
muted muted Specifies that the audio output of the video should be muted
poster URL Specifies an image to be shown while the video is downloading, or until the user hits the play button
preload auto
metadata
none
Specifies if and how the author thinks the video should be loaded when the page loads
src URL Specifies the URL of the video file
width pixels Sets the width of the video player

전역 속성

<video>태그는 HTML의 전역 속성도 지원 합니다 .


이벤트 속성

<video>태그는 HTML의 이벤트 속성 도 지원합니다 .


관련 페이지

HTML DOM 참조: HTML 오디오/비디오 DOM 참조


기본 CSS 설정

없음.