<audio src="오디오 경로" controls> </audio>코드
<audio src="mp3/background-music-mp3-free-download-267823.mp3" controls>
오디오 파일을 지원하지 않는 브라우저를 사용하는 사용자에게 대체 텍스트 표시
Your browser does not support the audio element.
</audio>절대경로
외부에 위치한 오디오 파일을 사용하고 싶을 때 사용
코드
<audio src="http://example.com/music.mp3">
</audio>상대경로
현재 웹페이지의 위치 기준으로 오디오 파일의 경로 지정
코드
<audio src="./music.mp3" controls></audio>controls : 화면에서 재생 컨트롤 막대 표시
src="오디오 파일의 위치를 연결"
1. autoplay
페이지의 로드와 동시에 오디오 파일을 자동으로 재생하는 속성
웹브라우저에서 사용자 경험과 보안 문제로 동작시키지 않는 추세다.
코드
<audio src="mp3/background-music-mp3-free-download-267823.mp3" controls autoplay></audio>2. muted
오디오가 재생중이지만 소리를 끔 (음소거)
코드
<audio src="mp3/background-music-mp3-free-download-267823.mp3" controls muted></audio>3. loop
반복재생
코드
<audio src="mp3/background-music-mp3-free-download-267823.mp3" controls loop></audio>4. volume
코드
<audio src="mp3/background-music-mp3-free-download-267823.mp3" controls volume="0.7"></audio>5. 크로스 브라우징
문서가 있다는 가정하에 다양한 확장자로 표현
크로스브라우징 : 웹페이지에서 제작시 모든 브라우저에서 의도한 바 그대로 올바르게 표현되는 것 (호환) / 각 브라우저마다 자체적인 css가 존재
중첩된 요소 내에 여러 형식을 작성할 수 있으며 브라우저는 상용하는 첫 번째 스스로 표현
혹은 요소 내에 비디오가 지원되지 않는 브라우저의 경우에 태그내에 있는 텍스트가 표현되어진다 !
코드
<audio controls>
<source src="mp3/background-music-mp3-free-download-267823.mp3" type="audio/mpeg">
<source src="mp3/background-music-mp3-free-download-267823.mp3" type="audio/ogg">
브라우저가 지원하지 않는 경우를 대비한 대체 텍스트
</audio>