HTML 참조 매뉴얼

HTML 태그 전체 목록

HTML: <video> 태그

HTML <video> 요소는 HTML 또는 XHTML 문서에 미디어 플레이어를 내장하여 문서 내 비디오 재생을 지원합니다. 또한 <video> 태그를 오디오 컨텐츠에 사용할 수 있지만, <audio> 요소가 사용자 경험에서 더 적합할 수 있습니다.

在线示例

通过video播放视频：

示例

!doctype　html>
<html>
<head>
<meta　charset="UTF-8">
<title>HTML　video标签的使用(基础教程网　oldtoolbag.com)</title>
</head>
<body>
<video　controls>
　　<source　src="movie.mp4"　type="video/mp4">
　　<source　src="movie.webm"　type="video/webm">
　　<p>Your　browser　doesn't　support　HTML5　video.　Here　is
　　　　　a　<a　href="movie.mp4">link　to　the　video</a>　instead.</p>
</video>
</body>
</html>

测试看看 ‹/›

浏览器兼容性

IEFirefoxOperaChromeSafari

所有主流浏览器都支持。

标签定义及使用说明

<video> 태그는 영상을 정의합니다. 예를 들어, 영화 스케치나 다른 비디오 스트림.

目前，<video> 요소는 MP4、WebM、Ogg。

浏览器	MP4	WebM	Ogg
Internet Explorer	YES	NO	NO
Chrome	YES	YES	YES
Firefox	YES 从 Firefox 21 版本开始 Linux 系统从 Firefox 30 开始	YES	YES
Safari	YES	NO	NO
Opera	YES 从 Opera 25 版本开始	YES	YES

MP4 = MPEG 4文件使用 H264 视频编解码器和AAC音频编解码器
WebM = WebM 파일은 VP8 视频编解码器和 Vorbis 音频编解码器
Ogg = Ogg 파일은 Theora 비디오 디코더와 Vorbis 오디오 디코더를 사용합니다.

音频格式的 MIME 类型

格式	MIME-type
MP4	video/mp4
WebM	video/webm
Ogg	video/ogg

HTML 4.01 与 HTML5之间的差异

<video> 태그는 HTML5 的新标签。

提示和注意

提示：可以在 <video> 和 </video> 태그 사이에 텍스트 내용을 배치하면, <video> 요소를 지원하지 않는 브라우저도 이 태그의 정보를 표시할 수 있습니다.

선택 속성

New: HTML5 에서 추가된 속성

속성	값	설명
autoplayHTML5	autoplay	이 속성이 존재하면, 비디오가 준비되면 즉시 재생됩니다.
controlsHTML5	controls	이 속성이 존재하면, 사용자에게 컨트롤을 표시합니다. 예를 들어, 재생 버튼
heightHTML5	pixels	비디오 플레이어의 높이를 설정
loopHTML5	loop	이 속성이 존재하면, 미디어 파일이 재생이 끝나면 다시 재생을 시작합니다.
mutedHTML5	muted	이 속성이 존재하면, 비디오의 오디오 출력이 무음이 됩니다.
posterHTML5	URL	비디오가 다운로드되는 동안 사용자가 재생 버튼을 클릭할 때까지 표시되는 이미지를 지정
preloadHTML5	auto metadata none	이 속성이 존재하면, 페이지 로드 시 비디오를 로드하고 재생 준비를 합니다. "autoplay"를 사용하면 이 속성을 무시합니다.
srcHTML5	URL	재생할 비디오의 URL
widthHTML5	pixels	비디오 플레이어의 너비를 설정

전역 속성

<video> 태그가 지원 HTML 전역 속성。

이벤트 속성

<video> 태그가 지원 HTML 이벤트 속성。

HTML: <wbr> 태그 HTML: <var> 태그