▣ <audio> 태그
· 웹 페이지에 오디오 파일을 삽입하는 태그
<audiosrc="audio_file.mp3"controlsloopautoplay></audio>
<audio> 태그 속성
· src : 재생할 오디오 파일이 저장된 경로 표시
· loop : 반복 재생
· muted : 음소거 상태로 시작
· controls : 재생 제어기 표시
· autoplay : 웹 문서가 열림과 동시에 자동으로 재생
· preload : 오디오 파일 사용 여부와 상관없이 미리 다운로드함
▣<source> 태그
· 여러 형식의 오디오 파일을 동시에 제공할 때 사용
· 재생에 적합한 파일이 없다면 마지막 문장 출력
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>오디오 삽입하기</title>
</head>
<body>
<h3>오디오 자동 재생</h3>
<audio src="bear.m4a" controls loop autoplay></audio>
<h3>오디오 수동 재생</h3>
<audio src="chicken.mp3" controls></audio>
<h3>오디오 다중 재생</h3>
<audio controls>
<source src="eagle.mp3" type="audio/mpeg">
<source src="eagle.ogg" type="audio/ogg">
<source src="eagle.wav" type="audio/wav">
오디오 파일을 재생할 수 없습니다.
</audio>
</body>
</html>
'웹프로그래밍 HTML > 태그와 멀티미디어' 카테고리의 다른 글
개체 삽입 태그 (0) | 2025.03.05 |
---|---|
<video> 태그 (0) | 2025.03.05 |
<img>태그 (0) | 2025.03.05 |
<table> 태그 (0) | 2025.03.05 |
목록 태그의 종류 (1) | 2025.03.05 |