본문 바로가기
html

[html5] embed 태그

by 지구별에 2014. 7. 16.

 

 

[html5] embed 태그


<embed> 태그는 외부 응용프로그램이나 플러그인을 삽입하는 태그입니다.

 

<object> 태그와 비슷하게, 주로 음악이나 영화를 삽입하는 데 쓰입니다.

 

<embed>태그는 많은 브라우저가 오랫동안 지원을 해왔지만


html4명세에서 빠졌습니다. (html4로 작성한다면 <object>태그를 사용해야 함)

 

 

[html] -object 태그 정리

 


그러다가 html5에서 새로 추가됐습니다.

 

따라서, html5에서 <embed>태그를 사용했을 때 유효하다 하더라도, html4에서 유효하지 않습니다.

 

 

▶함께 사용할 수 있는 속성

 

height: px   삽입 내용의 높이
width: px    삽입 내용의 너비
src: URL    삽입할 외부 파일의 주소
type: MIME_type 삽입 내용의 MIME(파일) 유형 (mime type은 여기 참조)

 

 

*html5에서 지원하지 않는 속성: align, alt, border, code, codebase, name  

 

▶embed 태그 지원 브라우저.

Chrom , FF 1.0, IE, Opera, Safari

 

 

 

사용 예: <embed> 태그는 닫는 태그가 없습니다. xhtml은 <embed />

 

<embed src="movie.swf">

 

사용 예 2:

 

<embed type="video/quicktime" src="movie.mov" width="500" height="400" />

 

 

 

 

<object>태그로 음악 파일을 삽입 예:

 

<object type="audio/x-wav" data="rain.wav"  width="400" height="100">
  <param name="src" value="rain.wav">         src: 파일의 경로 지정
  <param name="autoplay" value="true">       autoplay: 파일을 자동으로 플레이할지 선택(예:true, 아니오:false)

  <param name="autostart" value="true">       autoplay와 동일(다른 브라우저)
  <param name="controller" value="true">   controller: 플레이어를 보일지를 선택(예:true, 아니오:false)

  <param name="loop" value="true">           loop: 음악 반복 재생((예:true, 아니오:false)
대체 내용</object>

 

 

<embed>태그로 음악 삽입 예:

 

<embed src="rain.wav" type="audio/wav" autoplay="true" loop="true" controller="true"   width="400" height="100">

 

 

 

 

브라우저 지원을 위해 두 태그를 섞어쓰기도 합니다. (같은 내용 같은 파일을 태그를 달리하여 쓴 것임)

 

<object type="audio/x-wav" data="rain.wav"  width="400" height="100">
  <param name="src" value="rain.wav">         

  <param name="autoplay" value="true">      

  <param name="controller" value="true">  

   <param name="loop" value="true">

<embed src="rain.wav" type="audio/wav" autoplay="true" loop="true" controller="true"  width="400" height="100">
<a href="rain.wav">음악을 들으려면 다운받으세요</a></object>

 

 

<a href="rain.wav">음악을 들으려면 다운받으세요</a>

 

=> 이 부분은 두 태그를 지원하지 않는 브라우저를 위해 직접 링크를 제공합니다.

 

 


 

 

▶ 음악 파일 관련 MIME type 보기

 

(type 속성에서 쓸 수 있는 mp3, ogg, wav 등의 다양한 파일 타입입니다)

이미지: http://webdesign.about.com/od/sound/a/sound_mime_type.htm

 

 

음악이나 영화 파일을 올리시기 전에  저작권에 위배되지 않는지 먼저 확인해 주셔야 되겠지요~

 

요즘에는 다음뮤직, 네이버뮤직 에서는 블로그나 까페에 배경음악(BGM) 용 파일을 구매하여 사용할 수 있도록 돼 있더군요...

 

저는 테스트 용으로 무료 mp3 파일(자장가)을 한 번 올려보겠습니다.

 

제가 사용한 코드:<embed type="audio/mpeg" width="200" height="200" src="abc.mp3" autoplay="false" controller="true">

 

 

 

 

 

 

반응형

댓글