[웹 프로그래밍 기초] 미디어 태그

미디어 태그

이미지,오디오, 비디오 등 멀티미디어를 넣을 때 사용

1. 이미지 태그

HTML 문서에서 이미지를 정의할 때 사용
HTML 문서에 직접 삽입되는 것이 아니라, HTML 문서에 이미지가 링크되는 형태

2. 오디오 태그

<audio> 태그는 음악이나 오디오 스트림과 같은 사운드를 정의

3. 비디오 태그

무비 클립이나 비디오 스트림과 같은 비디오를 정의할 때 사용
웹 브라우저만으로도 동영상을 볼 수 있게 함

미디어 태그 속성

태그	속성	설명
img 태그	src	이미지 경로 지정
	alt	이미지가 없을 때 나오는 글자 지정
	width	이미지의 너비 지정
	height	이미지의 높이 지정
audio,video 태그	src	음악,비디오 파일의 경로 지정
	preload	음악,비디오를 준비 중일 때 데이터를 모두 불러올지 여부 지정
	sutoplay	음악,비디오의 자동 재생 여부 지정
	loop	음악,비디오의 반복 여부 지정
	controls	음악,비디오 재생 도구 출력 여부 지정
video 태그	width	비디오의 너비 지정
	height	비디오의 높이 지정

이미지 삽입하기

<img src="photo.jpg" alt="배경 사진" width="300">

음악 삽입하기

   <audio controls="controls" >
    <source src="video.mp3" type="video/mp3">
   </audio>

동영상 삽입하기

   <video controls="controls" >
       <source src="video.mp4" type="video/mp4">
   </video>