Computer >> 컴퓨터 >  >> 프로그래밍 >> HTML

HTML5에서 외부 애플리케이션을 위한 컨테이너 추가하기 - embed 태그 완벽 가이드

HTML에서 <embed> 태그는 외부 애플리케이션이나 대화형 콘텐츠를 위한 컨테이너 역할을 합니다. 이 태그를 사용하면 플러그인이 필요한 멀티미디어 파일이나 외부 리소스를 웹 페이지에 직접 삽입할 수 있습니다.

embed 태그의 주요 속성

HTML <embed> 태그는 다음과 같은 속성들을 지원합니다.

속성설명
height픽셀(px)임베드된 콘텐츠의 높이를 지정합니다.
srcURL삽입할 소스 파일의 주소를 지정합니다.
typeMIME_type콘텐츠의 MIME 유형을 지정합니다.
width픽셀(px)임베드된 콘텐츠의 너비를 지정합니다.

사용 예제

다음 코드를 실행하면 HTML5에서 외부 애플리케이션을 위한 컨테이너를 추가하는 방법을 확인할 수 있습니다.

<!DOCTYPE html>
<html>
   <head>
      <title>HTML Embed Tag</title>
   </head>
   <body>
      <embed src = "/html/yourfile.mid" width = "300" height = "150" />
   </body>
</html>

위 예제에서는 MIDI 오디오 파일을 너비 300px, 높이 150px 크기로 웹 페이지에 삽입하고 있습니다. src 속성에는 실제 파일 경로를 지정하며, 필요에 따라 type 속성을 추가하여 MIME 유형을 명시적으로 선언할 수도 있습니다.

참고: <embed> 태그는 닫는 태그가 없는 빈 요소(void element)이며, HTML5부터 공식 표준으로 채택되었습니다. 다만 최신 브라우저 환경에서는 플러그인 의존도가 낮아진 만큼, 가능하면 <video>, <audio> 등 시맨틱 태그 사용을 우선 고려하는 것이 좋습니다.