본문 바로가기


IT 이야기/HTML 강좌

#HTML 강좌 - bgsound 태그 embed 태그 iframe 태그

by 낭만ii고양이 2018. 4. 26.



안녕하세요 낭만고양이 입니다. 오늘은 음악 재생 테그에 대해서 배워보도록 하겠습니다.

글자를 표현하는 가장 기본적인 테그이니 알아두시면 매우 유익할것입니다.

이 포스팅을 보시기전에 앞강좌를 보시지 않았다면 보시고 아래링크를 따라가서 공부하고 오세요.




 bgsound 테그 


<bgsound src="음악파일주소.wma" loop="0">




bgsound 테그는 인터넷 익스플로러에서만 작동합니다. 주로 홈페이지 배경음악 삽입할때 이테그를 사용합니다. 그리고 화면에 아무런 내용이 출력되지 않으므로 방문자가 음악을 끄기가 힘듭니다. 
loop 속성은 배경음악의 반복 횟수를 지정합니다. -1 이나 INFINITE 값으로 지정하면 계속적으로 반복됩니다.


 embed 테그 




<embed src="음악파일주소.wma">



embed는 익스플로러뿐 아니라 다른 웹브라우저에서도 작동을 합니다. 그리고 웹브라우저상에 미디어 플레이어가 표시됩니다.

음악파일 뿐만 아니라 영상파일도 지원합니다.

embed 테그에서 사용할 수 있는 속성은 아래와 같습니다.


autostart="true/false" : true의 경우 페이지 로딩시 자동실행되고 false로 지정하면 플레이 버튼을 눌러야 음악이 재생됩니다.

hidden="true/false" : 미디어 플레이어가 화면에 출력되는지 여부를 지정합니다.

loop="true/false" : 음악의 반복여부를 지정합니다.

width="수치" height="수치" : 미디어 플레이어의 크기를 지정합니다.  동영상 파일일경우 지정하시면됩니다.

Showcontrols="value" : 미디어 플레이어, value 값은 0 , 1

VOLUME = "수치값" : 플레이 되는 음악의 소리 크기를 임의로 설정하는 속성입니다.

hspace="value" vspace="value" : 미디어 플레이어의 수직/수평 여백값을 조절하는 옵션입니다.

mute=1 : 음소거기능입니다. 소리가 나지 않습니다.


 EMBED 태그 내에서는 "false" 대신 "0", "true" 대신 "1"을 넣어도 같은 효과입니다.





 iframe 테그 


iframe 요소는 html 웹 문서 안에 또 다른 웹 문서를 넣을 수도 있고, 뮤비 등 동영상도 넣을 수 있습니다.

iframe 은 inline frame이라고도 부르는데요, 원래는 ie에서만 작동했지만,html 4.01부터 iframe을 포함하여, 현재 모든 브라우저에서 <iframe> 태그를 지원합니다.



※ 사용예제

<iframe src="URL">대체 내용</iframe>  


※ 사용할수있는 속성

src    iframe에 삽입될 웹문서의 주소

width   iframe의 너비 지정 (px, % 가능)

height   높이 지정 (px, % 가능)

frameborder   테두리를 표시할지 말지를 지정 1(테두리가 있음) 0(테두리 지우기)

scrolling  스크롤바 유무를 선택 yes(스크롤바 표시), no(스크롤바 없앰), auto (자동)

longdesc  iframe에 담길 내용을 설명하는  페이지.

marginheight  내용의 top(위) bottom(아래) margin.

marginwidth   내용의 left(좌) right(우) margin.

align    iframe을  정렬 top( 맨 위에 정렬) middle(중앙 정렬) bottom(아래에 정렬) left(왼쪽 정렬) right(오른쪽 정렬)

name  taget이 필요한 프레임의 이름 (id와 같음)



<iframe width="600" height="400" src="https://www.daum.net/" frameborder="1" scrolling="yes" align="center">
이 브라우저는 iframe을 지원하지 않습니다</iframe>



↘위소스를 실행한 화면이 아래입니다.



이처럼 iframe 태그는 다른웹페이지의 문서를 가지고 오는거다 라고 생각하시면 될것 같습니다.







제 글이 도움이 되셨다면  "공감 (♡)" 한번씩 클릭해주시고 응원의 댓글들도 남겨주세요.


 







댓글