COMPUTER STUDY

테그 공부하기...

Lee-Sun 2009. 1. 2. 14:45

기초테그 총정리(글씨 클릭)

 

 

기본태그
글씨태그
그림태그
음악태그
폭탄태그는 생략하는 것이 좋겠죠?
배경화면
배너강좌
배너질문
특수문자
RGB 색상표
이제 공부한 내용을 연습해보아야겠죠? 여기 연습장 한 권 드릴테니 마음껏 연습해보세요...
#태그연습장#


 

 

(처음 긁어서 연습하기 방법)

카페의 게시판에 있는 글은 동영상이든, 플래쉬든, 예쁜글이든

같은 방법으로 글 옆에 오른쪽마우스 클릭후


소스보기 클릭후! 

아래부터

바로 위까지 복사하셔서

그대로 글쓰기에 붙여넣기 하시면 됩니다.

 

이렇게 소스를 퍼올때는 본인이 놓고 싶은 글이나 다른 소스를 넣을수 있구요....

 


만약 글,동영상,플래쉬만 그대로 퍼오고 싶으시면 빠른 방법이 있습니다.

 

예쁜글등 기타 퍼오고 싶은 내용을 그대로 드래그 복사하셔서

 

글쓰기에

"에디터" 클릭후

붙여넣어서 등록하시면 됩니다.

 

이 방법이 더 간단하겠네요.

 

여기에서 본인이 원하시는 태그나 글을 넣고 싶으시면

수정 클릭후 에디터에서 태그없이 글을 추가하거나 뺄수도  있구요,,..

수정 클릭후 HTML 를 체크하시면 태그소스가 보입니다.

이곳에 태그를 추가.삭제도 할수 있습니다. 

 

도움이 되셨으면 합니다.

한두번 연습하시면 금방할수 있으니 연습하시고 예쁜글 많이 넣어주세요~~

 

 

참고: 소스보기를 하실때 간단히 찾는 방법!

        [ctrt +f]  하시면 "찾기"가 나옵니다.

        그곳에 "스크랩 출처" 를 클릭하시면 금방  찾을수 있답니다.


 

 

 

 

테그의 기본

테그의 기본을 공부하고자 하는 완전초보자를 위하여 작성합니다.

html 이란 ?
Text Markup Language 는 www (월드 와이드 웹 )상에서
문서를 작성하는 언어로서 기본테그 웹프로그래밍 언어는 여러가지가 있습니다.
대표적으로 java 와 html이 있습니다.
툴로서는 namo, flash, dreamweaver등이 있으며
그래픽툴은 photoshop, illustrator 등입니다.

그중에서 html테그는 가장 기초적이며 쉽게 배울수 있으며 요즈음 음악화일, 그림화일, 웹엽서
시와 영상등 여러가지 컨텐트가 활성화되고 취미 활동으로 활성화 되고 있습니다.
이러한 게시판의 화일들을 복사하여 당신의 화일로 만들수 있다면 얼마나
좋겠습니까? 아직 시작하시지 않은 분이라면 지금부터 시작하시지요.

기본테그의 몇가지를 소개합니다.

* 기본테그
------------------------------------------------------------------------------
br .................................. /br 줄바꿈
align=center, align=left, align=right 위치를 중앙, 오른쪽, 왼쪽을 지정
pre, ................../pre 사이에 있는 문자를 그대로 표시
font color red size=4 글자의 칼라와 크기를 4호지정 ( 코드와 크기 호수도 무방)
font face 글씨체
center ...... center/ 사이에 있는 글이나 문자를 중앙에 정렬
border 테두리지정
td......./td 셀의 내용지정
tr ....../tr td의 시작과 끝지정
table......./table 표을 만드는 테그
bordercolor 테두리 색지정
width=500 그림이나 사진등의 폭을 500 지정
height=600 그림이나 사진등의 높이를 600 지정

img src=http://img.yahoo.co.kr/blank.gif .jpg" 그림을 올릴때 보이도록하는 명령어
embed src=http://img.yahoo.co.kr/blank.gif " 음악이나 플래쉬파일을 실행하는 명령


*움직이는 글과 그림
------------------------------------------------------------------------------
marquee ................/marquee 사이에 있는 글이나 그림등을 옆으로 흐르게 함
direction=up,down 위로 울라가기, 내려가기
scrollamount=1.5 움직임속도
scrolldelay=100 스크롤지연시간
loop="3" 3회 반복하기
behvior 스크롤형태지정
alternate 반복해서 움직임
slide 비스듬 미끄러지는 움직임
예) MARQUEE scrollAmount=2 behavior=alternate width=500
폭이 500폰트 크기로 좌우로 반복해서 움직이는 마퀴

◀marquee 명령어 이해하기..^^*
ⓐ.behavior=slide ☜━marquee 영역의 끝 부분에서 멈춥니다.
ⓑ.behavior=scroll ☜━marquee 영역을 벗어나서 사라집니다.
ⓒ.behavior=alternate ☜━양쪽으로 움직이것을 설정합니다.
ⓓ.direction=up ☜━글자가 위쪽으로 움직이게 해줌니다.
ⓔ.direction=down ☜━글자가 아래로 움직이게 해줌니다.
ⓕ.direction=left ☜━글자가 왼쪽으로 움직이게 해줌니다.
ⓖ.direction=right ☜━글자가 오른쪽으로 움직이게 해줌니다.
ⓗ.bgcolor=yellow ☜━배경설정합니다.(색상은 맘대로 바꾸시면 되겠죠.*^^*)
ⓘ.scrollamount=10 ☜━글짜 움직이는 속도을 설정합니다.(숫자가 적을수록 느려짐니다.)
ⓙ.scrolldelay=100 ☜━스크롤의 지연효과를 얻기 위해서 사용합니다.(1초간 멈추었다가 이동함.!)
ⓚ.bgcolor=yellow ☜━배경색을 설정합니다.(노란색으로 설정)
ⓛ.width=100 ☜━가로 폭을 설정합니다.(100으로 가로 길이설정)
ⓜ.height=100 ☜━세로 폭을 설정합니다.(100으로 높이 길이 설정)
ⓝ.hspace=100 ☜━marquee의 좌우에 지정한 만큼의 여백이 설정합니다.
ⓞ.vspace=100 ☜━marquee의 위와 아래에 지정한 만큼의 여백이 설정합니다.
ⓟ.loop=1 ☜━1번 반복입니다.(원하는 숫자을 넣으면 되겠죠.*^^*)
(※.loop=infinite ☜━무한 반복을 시켜줌니다.)
ⓠ.align : 정렬 방식을 설정한다.(ex. align=top )
(absbottom | absmiddle | baseline | bottom | left | middle | right | texttop | top)

--------------------------------------------------------------------------------
* 음악파일명령어
음악 명령어의 속성에 대하여 알아보겠습니다.

1. autostart="true" 문서가 뜨는 동시에 음악이 연주 명령어

2. hidden="true" 는 뮤직박스를 숨김 명령어

3. hidden="false" 는 뮤직박스를 나타내는 명령어
(사실 이명령어는 뮤직박스를 숨길때만 필요하죠 넣지 안아도 기본적으로 보입니다.)

4. loop="infinite" 는 음악을 무한히 계속 반복하라는 명령어
loop="1" 이면 음악이 한번만 나오고 멈추지요
loop="2" 면 두번 연주 되겠죠
loop="-1" 이렇게 해도 음악을 무한 반복 합니다

5. volume=" 원하는 수" 를 넣으면 음악의 볼륨을 조절할수 있읍니다
volume="30"정도면 아주 적게 들리고
volume="70"이면 보통

6. width="수치" 미디어 플레이어의 가로 크기를 지정 합니다.

7. height="수치" 미디어 플레이어의 세로 크기를 지정 합니다.

8. PLUGINSPAGE="URL" : 플러그인이 설치되어 있지 않은 사용자를 위하여
해당 플러그인을 제공하는 사이트의 주소를 적습니다.

9. NOEMBED /NOEMBED 사용자의 브라우저가 플러그인이 설치되어 있지 않은 경우나
이를 지원하지 못하는 브라우저를
사용하고 있는 경우에 IMG의 ALT와 같은 역할을 합니다.
사용 방법은 NOEMBED 넣고 싶은 내용 /NOEMBED 를 EMBED 와
/EMBED
사이에 넣어 주시면 됩니다.

최종적으로 완성된 소스는 이렇게 됩니다.
embed src="http://myhome.hanafos.com/~dimmerm/music/adagio.asf" autostart="false" hidden="false" volume="70" loop="1" width=280 height=45 PLUGINSPAGE="HTTP://quicktime.apple.com/qt/sw/sw.html"
NOEMBED 음악이 들리시지 않으면 미디어 플레이어를 설치 하세요. /NOEMBED
/embed


위의 음악은 autostart="false" 로 했기에 플레이 버턴을 눌러야 음악이 나옵니다. 자동으로 음악이 나오게 할려면 autostart="true"로 해주시고 미디어 플레이어가 안보이게 할려면 hidden="true" 로 수정하세요.

bgsound 를 사용 하여도 됩니다.

bgsound src="http://myhome.hanafos.com/~dimmerm/music/adagio.asf"

* 여기에서 웹주소가 밑줄이 간것을 클릭하시면 파일이 사용가능한지를 확인할수 있습니다.
음악 사이트가 중지 곳이 간혹있습니다. 음악 웹주소를 익스플로러의 주소창에 복사해서
붙여넣어서 테스트 하면 더욱 정확합니다.



*응용 실행테그
------------------------------------------------------------------------------
body background="http://.........." 지정한 그림화일을 배경으로 적용
img src="http://......." 지정한 그림화일를 실행하는 명령어
a href="http://.........." 지정한 싸이트로 넘어가도록 링크
a href="http://.........."target=_blank 지정한 싸이트를 별도로 열어주도록 링크

bgsound src="http://img.yahoo.co.kr/blank.gif" 음악화일을 실행하도록함
embed src="http://img.yahoo.co.kr/blank.gif" 음악화일이나 플래쉬화일을 열도록함
( 일부 게시판에서 테그의 사용을 제한하고 있습니다.)

*모든 테그에는             <>표로 열고 닫기를 해야만 합니다.
--------------------------------------------

*샘플 화일
-----------------------------------------------------------------------------
EMBED style="WIDTH: 334px; HEIGHT: 45px" src=http://user.postown.net/elbosco1/gallery/various_flight_song.asf width=334 height=45 PlayCount="0" AutoStart="-1"

샘플 음악화일
1) embed src=http://temp.finesugar.com/attach_files/max.php?n=361156 loop=-1 volume=0 width=80 height=27 hidden=true

2) embed src="http://myhome.naver.com/samter20/hga/TimMacBrian.asx"showstatusbar=1 showstatusbar=1 onc       ontextmenu="return false" width="200" height="40" style='border:ridge 2 skyblue;'volume="0"
img src="http://samter20.cafe24.com/ongdalsam_b.gif"


샘플 영상화일
 iframe   src="http://myhome.naver.com/choiwon71/heho/app1.htm"

샘플 사진화일
img src=http://www.shalcom.co.kr/ys3.JPG


* 좋은 글과 영상물이 있는 유익한싸이트를 소개합니다.
--------------------------------------------------------------------------
http://mysesang.com/

http://www.happy.co.kr/

http://shalcom.co.kr/

http://sonagi.id.to/

앞으로 여러분께 유익한 블로그로 발전하겠습니다.

TOP 이미지 컴기초(영상)
■컴 공부 1■ ■컴 공부 2■
태그 기초 자바 강좌
■웹 요 리사■ 태그소스
배경 화면 전문 분야


 

분위기 있는 가을노래모음