> 웹 프론트엔드 > H5 튜토리얼 > h5 비디오 태그 사용에 대한 예제 코드

h5 비디오 태그 사용에 대한 예제 코드

零下一度
풀어 주다: 2018-05-15 10:30:20
원래의
5291명이 탐색했습니다.

HTML 비디오는 HTML 5+에 적합하며 온라인 보기를 위한 비디오 스트리밍 미디어를 정의하는 데 사용됩니다.

HTML이 필요한 친구들의 편의를 위해 간략하게 소개합니다.

<video 
width
="320" 
height
="240" src="m.sbmmt.com/movie.ogg" controls="controls">
로그인 후 복사

브라우저가 HTML 5를 지원하지 않는 경우 여기에 있는 텍스트가 표시됩니다. 지원되는 경우 비디오가 직접 표시되고 텍스트는 무시됩니다.

HTML 4 이전에서는 온라인으로 보기 위해 웹 페이지에 비디오를 삽입하려면 일반적으로 <를 사용하여 Flash 비디오 스트리밍을 사용해야 합니다. ;object> 및 태그를 사용하면 브라우저를 통해 swf, flv 및 기타 형식의 비디오 파일을 재생할 수 있지만 전제는 브라우저가 타사 플러그인인 Adobe Flash Player를 설치해야 한다는 것입니다. 최신 스마트폰과 아이패드는 일반적으로 Flash를 지원하지 않으므로 웹에서 비디오를 탐색할 수 없습니다. HTML 5에서는 이러한 사실이 바뀌었습니다. 웹 개발자는 타사 플러그인 없이 비디오 파일을 쉽게 로드하기 위해

속성설명
자동재생autoplay이 속성이 있으면 동영상이 준비되는 즉시 재생됩니다.
컨트롤컨트롤이 속성이 나타나면 플레이 컨트롤이 사용자에게 표시됩니다. 🎜> 버튼.
높이픽셀 값 동영상 플레이어의 높이를 설정합니다.
looploop이 속성이 나타나면 미디어 파일 재생이 끝난 후 재생이 다시 시작됩니다.
preloadauto/meta/none동영상을 미리 로드할지 여부를 지정합니다. 가능한 값은 다음과 같습니다.
auto - 페이지가 로드될 때 로드 로드됨 전체 동영상
메타 로드 - 페이지가 로드될 때 메타데이터만 로드
none - 当页面加载后不载入视频
* src视频地址要播放的视频的 URL,建议使用绝对地址。
width像素值设置视频播放器的宽度。


如何写兼容的视频标签?

由于旧的浏览器和Internet Explorer不支持

<video width="320" height="240" controls> 
<!-- 兼容 Firefox --> 
<source src="http://www.jb51.net/ movie.ogg" type="video/ogg" /> 
<!-- 兼容 Safari/Chrome--> 
<source src="http://www.jb51.net/ movie.mp4" type="video/mp4" /> 
<!-- 如果浏览器不支持video标签,则使用flash --> 
<embed src="http://www.jb51.net/ movie.swf" type="application/x-shockwave-flash" 
width="320" height="240" allowscriptaccess="always" allowfullscreen="true"></embed> 
</video>
로그인 후 복사

【相关推荐】

1. 免费h5在线视频教程

2. HTML5 完整版手册

3. php.cn原创html5视频教程

4. H5 video标签只能放声音不能放视频的解决办法

5. IIS的MIME未注册MP4类型,导致无法识别vidoe标签的解决办法

위 내용은 h5 비디오 태그 사용에 대한 예제 코드의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

관련 라벨:
원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿