본문 바로가기
소소한 일상 정리/유튜브 | 블로그 | SNS

티스토리 블로그 게시글에 배경음악 BGM 넣기 및 콘트롤 방법 HTML

by 코코쥬안 cocojuan 2022. 12. 9.

티스토리 블로그 게시글에 배경음악 BGM 넣기 및 콘트롤 방법 HTML

 

▣ 목록 (LIST) ▣

1. Audio Tag 이해하기

2. 클릭하면 재생되도록 설정하기

3. 블로그 글 페이지가 열리면 자동으로 배경음악(BGM)이 재생되도록 설정하기

4. 블로그 글 페이지가 열리면 자동으로 배경음악(BGM)이 재생되면서 반복 설정하기

 

 

 


 

1. Audio Tag 이해하기

  • src | 오디오 링크 URL 값 (mp3, wav, ogg 등) ⇾ 음악이 들어가 있는 주소 입력
  • autoplay | 자동재생 설정
  • loop | 반복재생 설정
  • controls | 컨트롤 재생/정지 등 노출 여부 설정
  • muted | 음소거 설정

 

 

 

 

2. 클릭하면 재생되도록 설정하기

<audio controls="controls"> <source src="오디오 링크 URL"> </audio>

 

 

 

3. 블로그 글 페이지가 열리면 자동으로 배경음악(BGM)이 재생되도록 설정하기

<audio autoplay="autoplay" controls="controls"> <source src="오디오 링크 URL"> </audio>

 

 

 

4. 블로그 글 페이지가 열리면 자동으로 배경음악(BGM)이 재생되면서 반복 설정하기

<audio autoplay="autoplay" loop="loop" controls="controls"> <source src="오디오 링크 URL"></audio>

 

 

 

이상으로

티스토리 블로그 게시글에 BGM 넣고 설정하는 방법에 대해 알아보았습니다.

 

 

댓글