8장. 이미지의 표현과 동영상, 음악 등 멀티미디어를 지원하는 태그

[ 목차 ]

1. 이미지

2. 미디어 - 오디오

3. 미디어 - 비디오

 

1. 이미지

1) 웹페이지에 이미지를 삽입하는 경우 img tag를 사용

2) 어트리뷰트

  1] src : 이미지 파일 경로

  2] alt : 이미지 파일이 없을 경우 표시되는 문장

  3] width : 이미지의 너비

  4] height : 이미지의 높이

 

2. 미디어 - 오디오

1) audio 태그는 HTML5에서 새롭게 추가

2) 어트리뷰트

  1] src : 음악 파일 경로

  2] preload : 재생 전에 음악 파일을 모두 불러올 것인지 지정

  3] autoplay : 음악 파일을 자동재생 개시할 것인지 지정

  4] loop : 음악을 반복할 것인지 지정

  5] controls : 음악재생 도구를 표시할 것인지 지정하며, 외관은 브라우저마다 차이 존재

  6] 웹 브라우저별 지원하는 음악 파일 형식

  7] source 태그를 사용해 파일 형식의 차이 문제를 해결할 수 있음

 

3. 미디어 - 비디오

1) video 태그는 HTML5에서 새롭게 추가

2) 어트리뷰트

  1] src : 동영상 파일 경로

  2] poster : 동영상 준비 중에 표시될 이미지 파일 경로

  3] preload : 재생 전에 동영상 파일을 모두 불러올 것인지 지정

  4] autoplay : 동영상 파일을 자동 개시할 것인지 지정