HtmlCss/HTML

audio, video 설정

플람 2019. 5. 25. 05:41
    <audio src="경로설정"></audio>
    
    <video src="경로설정"></video>

    <audio controls>
        <source src="경로설정 파일1">
        <source src="경로설정 파일2">
    </audio>
    <video controls>
        <source src="경로설정 파일1">
        <source src="경로설정 파일2">
    </video>

<audio>태그

 <audio src="경로명/파일명.확장자"></audio>

audio에서 지원하는 파일 형식 ==> mp3, wav, ogg,

  • controls ==> 음악을 재생. 정지. 볼륨조절등을 할 수 있는 객체를 나타낸다.
  • autoplay ==> 자동 재생
  • loop ==> 반복 재생
  • muted ==> 무음 처리(볼륨이 0)

<video>태그

<video src="경로명/파일명.확장자"></video>

vedio에서 지원하는 파일 형식 ==> mp4, ogv, webm

  • width, height ==> 재생화면의 너비와 높이
  • controls ==> 비디오를 재생, 정지, 볼륨조절등을 할 수 있는 객체를 나타낸다.
  • autoplay
  • loop
  • muted
  • poster ==> 재생하기 전의 재생화면에 나타날 그림을 지정한다.

<source>태그 

<source src= " 경로명/ 파일명. 확장자">;

  • audio나 video태그를 구성할 때 재생할 파일들을 설정하는 태그
  • Souce태그가 여러개 있으면 위에서 부터 차례대로 재생할 수 있는지 여부를 검새하여 재생할 수 있는 파일이 있으면 그 일을 재생한다.
  • 호환성을 높이기 위해서 주로 사용된다.