HTML 강좌 6편 - 오디오(음악) 재생하기 | <audio> | <source> | HTML Tag |
HTML
- Audio
- Type && Format
- Support Browser
- Property (Attributes)
- Source
- Usage
- Sample
Audio
html tag중에 음악파일(.mp3, .wav 등)을 탑재하는 태그 입니다.
Type && Format
지원하는 확장자(포맷)와, 그에 따른 선언 타입 형식입니다.
Format |
MIME - Type |
.mp3 |
audio/mpeg |
.ogg |
audio/ogg |
.wav |
audio/wav |
Support Browser
Browser에서 지원하는 각 타입은 아래와 같습니다.
Browser |
.mp3 |
.ogg |
.wav |
IE(Internet Explorer) |
O |
X |
X |
Chrome |
O |
O |
O |
FireFox |
O |
O |
O |
Safari |
O |
O |
X |
Opera |
O |
O |
O |
Property
Attributes |
Value |
Description |
autoplay |
autoplay |
자동재생 |
controls |
controls |
재생 / 일시 정지 / 정지 버튼 표시 |
loop |
loop |
반복 재생 |
muted |
muted |
음소거 |
preload |
auto metadata none |
audio 로드 방법 auto : 서버에 위협없이 다운 metadata : metadata만 다운 none : 안함 |
src |
URL |
audio의 경로 |
Source
Browser마다 지원하는 Audio 재생 형식이 다르기 때문에
Source라는 태그를 이용하면 좀더 능동적인(?) 업로드를 할 수 있습니다.
Source 태그는 Video 태그 객체에서도 지원을 합니다.
Usage
See the Pen vjPRLN by GM Yankee (@GMyankee) on CodePen.
Sample