어제의 나보다 성장한 오늘의 나

[HTML5] 오디오 태그, 비디오 태그 본문

공부/HTML

[HTML5] 오디오 태그, 비디오 태그

NineOne 2021. 4. 2. 02:08

이 기능은 HTML5에서 추가된 기능이므로 인터넷 익스플로러 8 이하에서는 사용할 수 없다.

 

audio 태그 주요 속성

  • src : 음악 파일의 경로 지정
  • preload : 음악을 재생하기 전에 모두 불러올지 지정
  • autoplay : 음악을 자동 재생할지 지정
  • loop : 음악을 반복할지 지정
  • controls : 음악 재생 도구를 출력할지 지정

 

웹 브라우저는 동영상을 WMV형식을 지원하지 않는다. MP4로 변환해서 사용하자

video 태그 

  • src : 비디오 파일의 경로
  • poster : 비디오 준비 중일 때의 이미지 파일 경로
  • preload : 비디오를 재생하기 전에 모두 불러올지 지정
  • autoplay : 비디오 자동 재생
  • loop : 반복 재생
  • controls : 비디오 재생 도구를 출력할지 
  • width : 비디오의 넓이
  • height : 비디오의 높이

 

위의 두가지의 태그는 웹 브라우저마다 지원하는 비디오 형식이 다르므로 source 태그를 사용해야 한다.

<body>
	<video poster="http://placehold.it/640x360" width="640" height="360" controls="controls">
        <source src="경로넣어주세요" type="video/mp4"/>
      </video>
<body>

 

출처

저작자표시 비영리

'공부 > HTML' 카테고리의 다른 글

호환 모드와 표준 모드  (0) 2021.04.25
[HTML] 시멘틱 구조 태그  (0) 2021.04.04
[HTML5] 이미지 크기는 아는데 아직 이미지가 없을때 사용하는 방법  (0) 2021.04.02
HTML5 페이지 구조  (0) 2021.04.02
'공부/HTML' Related Articles more
Comments