Front-End/HTML

04-5 오디오와 비디오 삽입하기

hoya7788 2023. 4. 13. 17:46

웹사이트에서 많이 사용하는 멀티미디어 형태는 오디오와 비디오임.

HTML에서는 <audio> 태그와 <video> 태그가 새로 추가되어 멀티미디어 파일을 더 편리하게 삽입할 수 있음.

 

>>> 다양한 멀티미디어 파일을 삽입할 때 쓰는 <object>, <embed> 태그

>> <object> 태그는 오디오 파일뿐만 아니라 비디오, 자바 애플릿, PDF 등 다양한 멀티미디어 파일을 삽입할 때 사용함.

웹 문서 안에 다른 문서를 삽입할 때도 사용할 수 있음.

[기본형] : <object width="너비" height="높이" data="파일"></object>

data 속성에 보여 줄 멀티미디어 파일을 지정하고 width, height 속성을 사용해 플레이어의 크기를 지정함.

 

>> <embed>태그에서는  src속성을 사용해 삽입할 멀티미디어 파일을 지정함.

필요할 경우 width, height 속성으로 플레이어의 너비와 높이를 지정 가능.

<embed>태그는 닫는 태그가 없음.

[기본형] : <embed src="파일 경로" width="너비" height="높이">

 

>>> 오디오와 비디오 파일을 삽입하는 <audio>, <video> 태그

[기본형] : <audio src="오디오 파일 경로"></audio>

[기본형] : <video src="비디오 파일 경로"></video>  controls속성 : 재생 또는 정지 버튼 추가