HTML5 동영상강좌 바로가기 

댓글 목록

HTML 태그 - video

페이지 정보

작성자 운영자 작성일 14-12-11 15:18 조회 6,350 댓글 0

본문

 

HTML 태그 - video

<video>태그는 영상컨텐츠를 표시할 때 사용합니다. html5에서 추가되었습니다.

속성

src : 영상파일의 경로를 지정합니다.

poster : 영상이 화면에 나타나지 않을 때 대신 표시할 이미지를 지정합니다.

autoplay : 영상을 자동 재생합니다. 아직 모바일에서는 자동재생되지 않습니다.

preload : 영상이 백그라운드에서 다운로드되어 재생버튼을 눌렀을 때 재생됩니다.

controls : 영상화면에 제어막대를 추가합니다.

width,height : 영상화면의 너비와 높이를 지정합니다.

 

샘플

<!DOCTYPE html>
<html>
 <head>
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
  <meta name="author" content="코리아뉴스" />
  <title> html공부 </title>
  <link rel="stylesheet" type="text/css" href="default.css" / >
  <style type="text/css">
  body {
   color:red;
  }
  </style> 
 </head>
 <body>
  <section>
   <h1>video태그</h1> 
   <p> 
   <video src="sample.mp4" width="480" height="320" autoplay controls poster="sample.jpg">  
   이 브라우저는 video태그를 지원하지 않습니다.
   </video>  
   </p>
   <p> 
   <video width="480" height="320" autoplay controls poster="sample.jpg"> 
   <source src="sample.mp4" type="video/mp4">
   <source src="sample.webm" type="video/webm">
   <source src="sample.ogv" type="video/ogg">
   </video>  
   </p>
  </section>
  <div id="related">
   <p>영역 </p>
  </div>
  <footer>
      <address> 전화 : 031-574-3659, E-mail : master@koreanews.com </address> 
                             Copyright ⓒ 2013 Koreanews co.,  All Rights Reserved.
  </footer>
 </body> 

</html> 

댓글목록 0

등록된 댓글이 없습니다.


HTML5 동영상강좌 바로가기