[8주차] 10. 태그 : <audio, video> 미디어를 띄우고 재생시키는 기능

 

* 위 코드에서 controls = "controls" 와 같이 속성을 추가한 것을 알 수 있는데

  일반적으로 속성의 이름과 속성의 값이 일치하면 속성이름만 써주면 된다.

 

*  audio, video 모두 브라우저마다 지원하는 음악파일의 코덱이 다르므로 여러가지를 나열시키는게 일반적이다.

 

<audio>

     <source src="파일경로1">

     <source src="파일경로2">

     이 메시지는 브라우저가 위의 모든 코덱을 지원하지 않는 경우에 보여집니다.

</audio>

- HTML5부터 제공되는 것으로 플러그인 없이 음악을 재생시킬 수 있는 기능이다.
  Safari, Chrome 브라우저에서는 mp3를 지원하며 FireFox,Opera 브라우저에서는 ogg를 지원한다.

+ controls 속성 : 재생바를 표시한다

+ autoplay 속성 : 접속되자 마자 자동재생

+ loop 속성 : 재생되는 동안 종료되더라도 다시 시작  

 

<video>

     <source src="파일경로1">

     <source src="파일경로2">

     이 메시지는 브라우저가 위의 모든 코덱을 지원하지 않는 경우에 보여집니다.

</video>

+ controls 속성 : 재생바를 표시한다

+ autoplay 속성 : 접속되자 마자 자동재생

+ loop 속성 : 재생되는 동안 종료되더라도 다시 시작