• 회원가입
  • 로그인
  • 구글아이디로 로그인

[media] HTML - <track> 태그 - 미디어트랙정보 (= track태그 = 트랙태그)</tr>

목차

  1. <track> 예제 - 미디어 트랙 정보
  2. <track> 정의
  3. <track> 속성

 

<track> 예제 - 미디어 트랙 정보


<video width="320" height="50" controls>
  <source src="homzzang.mp4" type="video/mp4">
  <source src="homzzang.ogg" type="video/ogg">
  <track src="homzzang_ko.vtt" kind="subtitles" srclang="ko" label="Korean" default>
  <track src="homzzang_en.vtt" kind="subtitles" srclang="en" label="English">
</video>

 

<track> 정의

 

<audio>나 <video>태그 같은 미디어 태그 내에서,
해당 파일이 재생되는 동안 보여줄 트랙 정보를 불러올 때 사용.

 


 

1. 

IE 10 등 주요 최신 브라우저 지원.

2. 

HTML5에 새로 도입

 

 

<track> 속성

 속성  속성값  의미  비고
 default  default  유저의 특별한 선택이 없는 한, 기본으로 보여줄 트랙 내용  HTML5
 kind  captions
 chapters
 descriptions
 metadata
 subtitles
 문자열 트랙 정보 종류  HTML5
 label  text 문자열  문자열 트랙 제목  HTML5
 src  URL 주소  필수 속성. 트랙 파일의 주소 명시  HTML5
 srclang  언어코드  트랙 문자열 데이터의 언어 종류 명시 (※ kind=subtitles 경우, 필수 속성)  HTML5
<track> 태그는 전역속성과 이벤트속성 지원.

분류 제목
attribute HTML - for 속성 - <label>/<output> 관련 요소 ID 바인딩 지정 (= for속성 = …
attribute HTML - open 속성 - <details> 태그 안 세부내용 표시함을 기본으로 지정 (= open속성 …
attribute HTML - ontimeupdate 속성 - (오디오/비디오) 재생위치 변경 시 실행 (= ontimeupd…
attribute HTML - onwheel 속성 - 마우스휠/터치패드휠 움직일 때 실행 (= onwheel속성 = 온휠속성…
attribute HTML - border 속성 - (HTML5 지원 X) 테두리 너비 지정 (= border속성 = 보더속성…
attribute HTML - value 속성 ★★★ - 요소값 지정 (= value속성 = 밸류속성) ※ 초기값/기본값/현재…
attribute HTML - contenteditable 속성 - 요소 내용 수정 가능 여부 지정 (= contentedit…
attribute HTML - formtarget 속성 - 폼데이터 전달할 폼 지정 (= formtarget속성 = 폼타겟속성…
attribute HTML - dirname 속성 - input/textarea 요소의 텍스트 방향 지정 (= dirname속…
attribute HTML - onscroll 속성 ★ - 마우스 스크롤 이벤트 시 실행 (= onscroll속성 = 온스크롤…
attribute HTML - class 속성 ★★★ - 클래스명 선택자 지정 (= class속성 = 클래스속성)
attribute HTML - onpaste 속성 - 사용자가 요소에 내용 붙여넣기 시 실행 (= onpaste속성 = 온패스…
attribute HTML - usemap 속성 - 이미지를 이미지맵으로 지정 (= usemap속성 = 유즈맵속성|유스맵속성)
attribute HTML - bgcolor 속성 - (HTML5 지원 X) 배경색 지정 (= bgcolor속성 = 비지컬러속…
attribute HTML - data 속성 - <object> 태그의 리소스 URL 주소 지정 (= data속성 = 데이터속…
attribute HTML - onfocus 속성 ★ - 포커스 설정 시 실행 (= onfocus속성 = 온포커스속성) ※ o…
form HTML - <input type="range"> 태그 - 지정범위 내 입력값 지정 (= 인풋레인지타입/레인…
attribute HTML - multiple 속성 ★ - 복수 (파일업로드/이메일입력/옵션선택) 허용 (= multiple속…
attribute HTML - target 속성 ★ - (링크된 문서 열 곳 / 폼 제출할 곳) 지정 (= target속성 =…
attribute HTML - maxlength 속성 ★ - 입력 가능한 최대 글자 개수 지정 (= maxlength속성 = …
8/18
목록
찾아주셔서 감사합니다. Since 2012