HTML5 비디오(비디오)

HTML5 비디오

웹 사이트의 비디오

아직까지 웹 페이지에 표시할 수 있는 방법이 없습니다. 비디오 표준 .

현재 대부분의 동영상은 플러그인(Flash 등)을 통해 표시됩니다. 그러나 모든 브라우저에 동일한 플러그인이 있는 것은 아닙니다.

HTML5는 video 요소를 통해 비디오를 포함하는 표준 방법을 지정합니다.

HTML5(동영상) - 작동 방식

HTML5로 동영상을 표시하려면 다음이 필요합니다.

<video width="320" height="240" controls>
  <source src="视频文件名称" type="视频格式">
  <source src="视频文件名称" type="视频格式">
您的浏览器不支持Video标签。
</video>

autoplay 속성

Instance

자동 재생으로 설정된 동영상 요소:

<video controls="controls" autoplay="autoplay"> 
 <source src="视频文件名称" type="视频格式"> 
  <source src="视频文件名称" type="视频格式">
您的浏览器不支持Video标签。
</video>

controls : 이 속성이 나타나면 재생 버튼과 같은 컨트롤이 사용자에게 표시됩니다.

<video> 요소는 동영상을 제어하기 위한 재생, 일시정지 및 볼륨 컨트롤을 제공합니다.

동시에 <video> 요소는 동영상 크기를 제어하기 위한 너비 및 높이 속성도 제공합니다. 높이와 너비가 설정되면 페이지가 표시될 때 필요한 비디오 공간이 예약됩니다. 짐을 실은. . 이러한 속성이 설정되지 않고 브라우저가 비디오의 크기를 알지 못하는 경우 브라우저는 로드 시 특정 공간을 예약할 수 없으며 페이지는 원본 비디오의 크기에 따라 변경됩니다.

<video> 및 </video> 태그 사이에 삽입된 콘텐츠는 video 요소를 지원하지 않는 브라우저에서 표시되도록 제공됩니다.

<video> 요소는 여러 개의 <source> 요소를 지원합니다.

비디오 형식 및 브라우저 지원

현재 <video> 요소는 MP4, WebM 및 Ogg의 세 가지 비디오 형식을 지원합니다.

브라우저 MP4 WebM Ogg

Internet Explorer 예                                                            🎜>Firefox                 예 예  ~                                   🎜>Opera 예(Opera 25부터) 예 예

MP4 = H.264 비디오 인코딩 및 AAC 오디오 인코딩이 포함된 MPEG 4 파일

WebM = VP8 비디오 인코딩 및 Vorbis 오디오 인코딩이 포함된 WebM 파일

Ogg = Theora 비디오 인코딩 및 Vorbis 오디오 인코딩이 포함된 Ogg 파일

지속적인 학습
||
<video width="320" height="240" controls> <source src="视频文件名称" type="视频格式"> <source src="视频文件名称" type="视频格式"> 您的浏览器不支持Video标签。 </video>
  • 코스 추천
  • 코스웨어 다운로드
현재 코스웨어를 다운로드할 수 없습니다. 현재 직원들이 정리하고 있습니다. 앞으로도 본 강좌에 많은 관심 부탁드립니다~