본문 바로가기

[학교] 시스템 보안 /HTML5 & CSS

HTML5 오디오 & 비디오 태그


5. 오디오 태그(ie9)
 - html5에서는 플러그인 도움없이 음악을 재생할 수 있다.

<형식>
<audio>~</audio>

**속성
1) src : 음악 파일의 경로 지정
2) autoplay : 음악을 재생하기 전 모두 불러올지 지정
3) loop : 음악을 반복할지 지정
4) controls : 음악 재생 도구를 출력할지 지정


5.1 source 태그
 - 브라우저별 지원하는 오디오 파일 형식이다.

 IE 크롬 파이어폭스  사파리 오페라
MP3  O  O      x    O   X
OGG  X   O      O    O   O
WAV  X  O      O    X   O

위와 같이 현재 지원하는 파일이 다르기에 이런 문제를 해결하는 것이 source 태그 이다.
mp3와 ogg 파일 2가지만 있으면 전부 지원하는 것과 같다.

-mp3 파일은 5000번 이상 재생하면 $2500를 지불해야 하므로 주의가 필요하다.

6. 비디오 태그
 비디오도 윈도우 미디어 플레이서 플래시와 같은 플러그인을 사용해야 재생이 되지만
 html5에서는 플래시 없이 재생이 가능하다.

 http://www.youtube.com/html5 에 들어가면 플래시 없이 재생이 가능한 방법을 제공한다.

<형식>
<video>~</video>

**속성
1) src : 비디오 파일의 경로 지정
2) autoplay : 비디오를 자동 재생할지 지정
3) loop : 비디오를 반복할지 지정
4) controls : 비디오 재생 도구를 출력할지 지정
5) poster : 비디오 준비중일 때 이미지 파일 경로 지정
6) width : 비디오 너비를 지정
7) height : 비디오 높이를 지정

** 브라우저별 제공하는 파일 형식
 IE 크롬 파이어폭스  사파리 오페라
MP4 O   O       X    O   X
WebM  X  O       O    X   O
OGV  X  O       O    X   O

'[학교] 시스템 보안 > HTML5 & CSS' 카테고리의 다른 글

CSS 기본 속성 다루기  (0) 2013.07.03
시멘틱 태그와 선택자  (0) 2013.07.03
FieldSet & div & span 태그  (0) 2013.07.03
1장 HTML5 기초  (0) 2013.07.03
하이  (0) 2013.03.14