>  기사  >  웹 프론트엔드  >  h5 비디오 태그 사용에 대한 예제 코드

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

零下一度
零下一度원래의
2018-05-15 10:30:205221검색

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

HTML이 필요한 친구들의 편의를 위해 간략하게 소개합니다. 39000f942b2545a5315c57fa3276f220는 온라인 보기용 비디오 스트리밍을 정의하는 데 사용되는 HTML 5+에 적합합니다.

<video 
width
="320" 
height
="240" src="www.php.cn/movie.ogg" controls="controls">

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

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

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


如何写兼容的视频标签?

由于旧的浏览器和Internet Explorer不支持39000f942b2545a5315c57fa3276f220元素,考虑到兼容性,我们必须为这些浏览器找到一个支持Flash文件的解决方案。不幸的是,和HTML 5音频一样,涉及到视频的文件格式,Firefox 和 Safari/Chrome 的支持方式并不相同。因此,如果你想在这个时候使用HTML 5视频,则需要创建三个视频版本。OGG,MP4,FLV/SWF

<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 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.