audio 태그를 이용한 오디오 파일 넣기

imjingu·2023년 7월 8일
0

개발공부

목록 보기
70/481

<audio> 태그를 이용한 오디오 파일 넣기

html5에서 음악이나 오디오같은 사운드를 재생하기위해 사용,
태그하나만으로 멀티미디어 기기에서 재생이 가능

autoplay = "자동재생" -> 크롬 브라우저가 업데이트 되면서 지원이 안됨
controls = 웹 하면에서 재생 컨트롤 막대 표시
muted = 오디오가 재생중이지만 소리를 끔(음소거)
prelod = 재생버튼을 눌러 재생하기 전에 오디오 파일을 다운로드해 준비
loop = 오디오를 반복재생
src = 오디오 파일의 위치를 연결

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    
    <audio src="../file/test_ado.mp3" controls autoplay="true"></audio>

    <!-- 브라우저 호환성을 위해 아래처럼 표현을 하기도 함 -->
    <audio controls>
        <source src="../file/test_ado.mp3" type="audio/mp3">
        <source src="../file/test_ado.ogg" type="audio/ogg">
        <p> 오디오 파일이 브라우저에서 지원되지 않습니다. </p>
    </audio>
</body>
</html>

오디오 파일이 브라우저에서 지원되지 않습니다.

0개의 댓글