HTML 테그 정리표
|
형 식 |
구 성 |
내 용 |
|
문서의 기본 구조를 나타내 주는 태그 | ||
|
<HTML> |
<HTML>...</HTML> |
HTML 언어로 작성되어 있다는 것을 알려줍니다. |
|
<HEAD> |
<HEAD>...</HEAD> |
Heading의 준말로 글의 머리말에 해당합니다. |
|
<BODY> |
<BODY>...</BODY> |
본문에 해당하는 부분을 알려줍니다. |
|
<TITLE> |
<TITLE>...</TITLE> |
타이틀바에 새겨질 글자를 정의합니다. |
|
<Hn> |
<Hn>...</Hn> |
표제 부분에 들어갈 말을 정의합니다. 1~6까지의 숫자를 사용하고 숫자가 커질수록 표제는 작아집니다. 기본값은 H4입니다. |
|
<!-...-> |
<!-주석내용-> |
주석을 달거나 잠시동안 이미지를 보이지 않게 할 때 사용합니다. |
|
문단 혹은 줄을 바꾸는 태그 | ||
|
<P> |
<P> |
문단을 바꾸는 태그입니다. 줄바꿈과 동시에 줄을 띤 것같은 효과가 나타납니다. |
|
<BR> |
<BR> |
문단을 바꾸는 태그입니다. 줄바꿈의 역할만을 수행합니다. |
|
<PRE> |
<PRE>...</PRE> |
여백이나 줄간격 등을 고정시켜 주는 역할을 합니다. |
|
글자의 크기를 마음대로 조절하는 태그 | ||
|
<FONT> |
<FONT SIZE=n> ...</FONT> |
글자의 크기를 마음대로 조절해 줍니다. 뒤의 숫자는 1~7이며 7이 가장 큰 크기입니다. 기본값은 3입니다. |
|
선그리기 태그 | ||
|
<HR> |
<HR ALIGN= WIDTH= SIZE=> |
입체적인 선을 그려줍니다. ALIGN은 선의 정렬을, WIDTH는 선의 폭을, SIZE는 선의 높이를 정해줍니다. |
|
이미지 맵을 처리하는 태그 | ||
|
<ISMAP> |
<IMG SRC= "..." ISMAP> |
이미지맵을 정의합니다. |
|
<MAP> |
<MAP NAME=...> ...</MAP> |
넷스케이프2.0에서 이미지맵을 정의합니다. |
|
목록을 정리해 주는 태그 | ||
|
<LI> |
<UL>...</UL> |
순서가 없는 목록으로 일반적인 나열을 말합니다. |
|
<OL>...</OL> |
순서가 있는 목록으로 위에서부터 번호를 매깁니다. | |
|
<MENU>...</MENU> |
메뉴 목록으로 그리길지 않은 문장의 열거에 사용합니다. | |
|
<DIR>...</DIR> |
디렉토리 목록으로 메뉴 목록보다 짧은 문장을 나열합니다, | |
|
<DL>...</DL> |
정의 목록 태그입니다. <LI>가 아닌 <DT>와 <DD>를 사용합니다. | |
|
문서를 가운데로 정렬시켜 주는 태그 | ||
|
<CENTER> |
<CENTER>... </CENTER> |
전체 문장을 가운데로 정렬시켜 줍니다. |
|
인용하기 태그 | ||
|
<BLOCKQUOTE> |
<BLOCKQUOTE>... </BLOCKQUOTE> |
문장 내에서 인용을 할 경우 들여쓰기를 한 후 인용구로 처리합니다. |
|
글자의 모양을 정의해 주는 태그 | ||
|
<STRONG> |
<STRONG>...</STRONG> |
굵은 글씨를 나타내 주는 태그입니다. |
|
<B> |
<B>...</B> | |
|
<EM> |
<EM>...</EM> |
이탤릭체의 글씨를 나타내 주는 태그입니다. |
|
<I> |
<I>...</I> | |
|
<KBD> |
<KBD>...</KBD> |
타자기체의 글씨를 나타내 주는 태그입니다. |
|
<CODE> |
<CODE>...</CODE> | |
|
<TT> |
<TT>...</TT> | |
|
배경 이미지 작업하기 | ||
|
<BODY> |
<BODY BACKGROUND="..."> |
배경 이미지를 띄워줍니다. |
|
<BODY BGCOLOR="#nnnnnn"> |
배경 색깔을 지정해 줍니다. | |
|
그밖의 태그들 | ||
|
<DFN> |
<DFN>...</DFN> |
정의되어지는 단어에 대한 것을 말합니다. |
|
<CITE> |
<CITE>...</CITE> |
책이나 사진 등의 제목을 말할 때 쓰입니다. |
|
<SAMP> |
<SAMP>...</SAMP> |
컴퓨터상에 메시지를 나탈낼 때 쓰입니다. |
|
<VAR> |
<VAR>...</VAR> |
이탤릭체로 표현됩니다. |
|
<SUB> |
<SUB>...</SUB> |
첨자에 관한 태그입니다. |
|
<SUP> |
<SUP>...</SUP> |
윗첨자를 나타냅니다. |
|
<BASEPOINT> |
<BASEPOINT>... <BASEPOINT> |
기본적으로 미리 약속된 크기를 다시 정할 때 사용합니다. |
|
부분을 강조해 주는 태그 | ||
|
<BLINK> |
<BLINK>...</BLINK> |
글자를 깜박이게 해줍니다. |
|
<U> |
<U>...</U> |
글자에 밑줄을 그어줍니다. |
|
연결하기 태그 | ||
|
<A> |
<A HREF="...">...</A> |
다른 홈페이지와 연결시켜 줍니다. |
|
<A NAME="...">...</A> |
자신의 홈페이지 내에서 연결해 줍니다. | |
|
주소 및 편지 서비스 | ||
|
<ADDRESS> |
<ADDRESS>... </ADDRESS> |
주소에 대한 정의를 내려줍니다. |
|
<MAILTO> |
<A HREF="MAILTO..."> |
편지쓰기 창을 띄워 줍니다. |
|
색상 지정하기 | ||
|
<BODY> |
<BODY TEXT= "#nnnnnn">...</BODY> |
글자색을 지정합니다. |
|
<BODY LINK= "#nnnnnn">...</BODY> |
하이퍼링크의 색을 지정합니다. | |
|
<BODY VLINK= "#nnnnnn">...</BODY> |
한 번 누른적이 있는 하이퍼링크의 색을 지정합니다. | |
|
<BODY ALINK= "#nnnnnn">...</BODY> |
누르고 있는 동안의 색을 지정합니다. | |
|
표 만들기 태그 | ||
|
<TABLE> |
<TABLE BORDER>... </TABLE> |
표의 전체 형식을 나타냅니다. |
|
<TR><TD></TD></TR> |
표 내부에 들어갈 형식을 정의합니다. | |
|
<TD COLSPAN=n> |
가로칸을 n만큼 합쳐줍니다. | |
|
<TD ROWSPAN=n> |
세로칸을 n만큼 합쳐줍니다. | |
|
<TD ALIGN=...> |
표안의 좌우 정렬 방식을 정의합니다. | |
|
<TD VALIGN=...> |
표안의 상하 정렬 방식을 정의합니다. | |
|
문서를 임의로 고정시키는 태그 | ||
|
<NOBR> |
<NOBR>...</NOBR> |
화면 크기에 따라 문단이 바뀌는 것을 방지합니다. |
|
<WBR> |
<WBR>...</WBR> |
위의 태그 안에서 문단을 바꿀 때 사용합니다. |
|
CGI 양식 첨가하기 | ||
|
<FORM> |
<FORM>...</FORM> |
양식을 정의합니다. |
|
<FORM METHOD="..." ACTION="..."> |
양식의 방법을 정의합니다. | |
|
<TEXTAREA> |
<TEXTAREA NAME="..." ROWS="..."> |
글틀 상자를 정의합니다. |
|
<INPUT> |
<INPUT TYPE="..."> |
어떤 형태로 입력할 것인지를 정의합니다. |
|
<INPUT TYPE="RADIO"> |
라디오 단추를 만들어줍니다. | |
|
<INPUT TYPE= "CHECKBOX"> |
체크 상자를 만들어 줍니다. | |
|
<INPUT TYPE= "SUBMIT"> |
제출 버튼을 만들어 줍니다. | |
|
<INPUT TYPE="RESET"> |
취소 버튼을 만들어 줍니다. | |
|
<SELECT> |
<SELECT NAME="..."> |
선택 사항 상자를 만들어 줍니다. |
|
창만들기 태그 | ||
|
<FRAME> |
<FRAMESET>... </FRAMESET> |
창의 기본 틀을 지정합니다. |
|
<FRAMESET ROW= "숫자 혹은 %"> |
위 아래로 나눠줍니다. | |
|
<FRAMESET COLS= "숫자 혹은 %"> |
좌우로 나눠줍니다. | |
|
<FRAME SRC="..." MARGINWIDTH="..."> |
창에 들어갈 좌우 여백을 정의합니다. | |
|
<FRAME SRC="..." MARGINHEIGHT="..."> |
창에 들어갈 상하 여백을 정의합니다. | |
|
<FRAME SCROLLING= "...> |
스크롤바를 설정해 줍니다. | |
|
<NOFRAMES>... </NOFRAMES> |
프레임이 안보이게 해줍니다. | |
|
이미지 다루기에 필요한 태그 | ||
|
<IMG> |
<IMG SRC="..."> |
이미지를 정의해 줍니다. |
|
<IMG SRC="..." ALIGN=...> |
이미지의 정렬 상태를 나타내 줍니다. | |
|
<IMG SRC="..." WIDTH="..." HEIGHT="..."> |
이미지의 크기를 조절해 줍니다. | |
|
<IMG SRC="..." LOWSRC="..."> |
이미지를 JPEG파일로 나타내 줍니다. | |
|
<IMG SRC="..." VSPACE= HSPACE=> |
이미지의 여백을 조절해 줍니다. | |
|
<IMG SRC="..." BORDER="..."> |
이미지의 태두리선을 조절합니다. | |
|
<IMG SRC="..." ALT="..."> |
이미지가 전송되지 않았을 경우에 글자로 대처해 줍니다. | |
'컴 자료모음' 카테고리의 다른 글
| 컴퓨터 빨라지게 하기 (0) | 2010.09.02 |
|---|---|
| 재부팅 빨리 하는 법 (0) | 2010.09.02 |
| 사진이 x(배꼽)으로 나올때 (0) | 2010.03.25 |
| [스크랩] 이미지 한화면에 여러장 만들기 (0) | 2009.04.10 |
| [스크랩] 포토웍 photoWORKS v1.5 사진 편집프로그램 (0) | 2009.02.01 |