웹사이트 관련 팁들을 모아놓은 곳입니다. 좋은팁 공유 합시다.
  • 웹미니 한줄 전광판 영역 입니다.
글 수 186

29

조회 수 : 2569 신고 : 0

profile
작성자 : title: [ani]깜빡이는 표정빽짱구
포인트 : 56933 | 레벨 : 25


HTML 태그목록

1. 기본 태그

<html>
<head>
<title>제목 없음</title>
</head>
<body>
</body>
</html>

태 그

기 능

 <HTML>........</HTML>

 HTML 문서의 시작과 끝을 지정한다.

 <HEAD>........</HEAD>

 HTML 문서의 머리 부분을 지정한다.

 <TITLE>........</TITLE>

 HTML 문서의 제목을 지정한다.        

 <BODY>........</BODY>

 HTML 문서의 본문 부분을 지정한다.

2. 글자 모양을 지정하는 태그

태 그

기 능

 <H숫자>글자</숫자>

 * 본문에서 제목 글자를 크게 하기 위해서 사용한다.
 * 숫자는 1에서 6까지 사용할 수 있으며 1이 가장큰 숫자이다.

 <FONT SIZE=번호>...</FONT>

 * 글자 크기를 조절한다.
 * 번호는1에서 7까지 사용한다.(7이 가장 큰 글자이다.)
 * 기본 크기는 3이고, +나 -를 사용해서 상대적인 크기를
   표현할수있다

 <ADDRESS>......</ADDRESS>

 주로 문서의 마지막 부분에 주소나 서명을 표현할 때 사용한다.

 

 

 

 

 

 

 

태 그

기 능

 <B>........</B>

 굵은 글씨체로 표현

 <I>..........</I>

 이탤릭체로  표현

 <TT>.......</TT>

 타자 친 것처럼 표현

 <U>.........</U>

 밑줄 글자로 표현

 <BIG>......</BIG>

 크게 표현

 <SMALL>........</SMALL>

 작게 표현

 <SUB>..........</SUB>

 아래 문자 첨자로 표현

 <SUP>..........</SUP>

 위 첨자 문자로 표현

 

 

 

 

 

 

태 그

기 능

 <EM>........</EM>

 이탤릭체로 표현

 <STRONG>.............</STRONG>

 굵은 글자로 표현

 <CITE>..............</CITE>

 인용 문구처럼 표현

 <KBD>.........</KBD>

 키보드로 입력받는 것처럼 표현

 <CODE>...........</CODE>

 영어 타자체로 표현

 <AU>.......</AU>

 저자의 이름을 표현할 때 사용

 <BLINK>..........</BLINK>

 깜박거리게 표현

3. 문단 모양을 지정하는 태그

태  그

기  능

 <P>

 문단을 구분한다.

 <P ALIGN=left/center/right>

 문단을 정렬하면서 구분한다.

 <BR>

 [ENTER]를 입력하는 것과 같이 줄을 바꾼다.

 <HR>

 수평선을 그린다.

 <HR ALIGN=left/center/right>

 * left : 선을 왼쪽으로 정렬한다.
 * center : 선을 가운데로 정렬한다.
 * right : 선을 오른쪽으로 정렬한다.

 <HR WIDTH=숫자>
<HR WIDTH=숫자%>

 * 숫자 : 길이를 픽셀 단위로 지정한다.
 * 숫자% : 화면의 크기를 기준으로 백분율로 지정한다.

 <CENTER>...........</CENTER>

 문장이나 글자들을 가운데로 정렬한다.

 <PRE>.......</PRE>

 입력한 내용의 모양과 형식을 그래도 표현한다.

 <XMP>.........</XMP>

 입력한 내용뿐만 아니라 태그까지도 모양과 형식을 그대로 표현한다.

 <BLOCKQUOTE>...</BLOCKQUOTE>

 다른 글을 인용할 때 주로 사용하는데 적당한 왼쪽 여백을 주어서 표현한다.

4. 그림을 넣는 태그

 태  그

 기  능

 <IMG SRC="그림 파일 이름">

 * 그림 파일을 문서에 넣는다.
 * 그림 파일 형식은 GIF,JPG,BMP,PNG 등을
    사용할 수 있다.

 ALIGN=top/middle/bottom/left/right

 * 그림과 문자를 같이 사용할 때 문자와 그림의 위치를 지정한다.
 * top : 글자를 그림의 위에 배치
 * middle : 글자를 그림의 중간에 배치
 * bottom : 글자를 그림의 아래에 배치
 * left : 그림을 글자의 왼쪽에 배치
 * right : 그림을 글자의 오른쪽에 배치

 WIDTH=가로크기

 그림의 가로 크기를 지정한다. %(백분율)로 지정하면 화면의 크기에 따른 비율로 조정된다.

 HEIGHT=세로크기

 그림의 세로 크기를 지정한다. %(백분율)로 지정하면 화면의 크기에 따라 비율로 조정된다.

 BORDER=굵기

 그림의 외각선 굵기를 지정한다.

 VSPACE

 그림의 위아래 여백을 지정한다.

 HSPACE

 그림의 좌우 여백을 지정한다.

 

 

 

 

 

 

 

 

 

 

5. 다른 문서와 연결하는 태그

 태  그

 기  능

 <A HREF="문서이름">............</A>

 문서 이름으로 지정된 파일과 연결한다.

 <A HREF="#특정단어">..........</A>

 같은 문서의 특정 단어로 연결한다.

 <A HREF="#특정단어">..........</A>

 문서안에 특정단어로 이름을 붙인다.

6. 문서에 색깔 넣는 태그

 태  그

기  능

 <BODY BGCOLOR="#RGB값">

 R(red:빨강), G(green:초록),B(blue:파랑) 의 혼합한
 값으로 홈페이지의 배경색을 지정한다.

 <BODY BACKGROUND="그림 파일 이름>

 지정한 그림 파일을 홈 페이지의 배경 그림으로 사용한다.

 <BODY TEXT="#RGB값">

 문서안의 천체 글자색을 변경한다.

 <BODY LINK="#RGB값">

 문서안의 링크색을 변경한다.

 7. 목록 만드는 태그

 태  그

 기  능

 <OL>........</OL>

 순서 있는 목록을 만든다.

 <LI>

 각각의 목록을 지정한다.

 <OL START=번호>..............</OL>

 목록이 시작되는 번호를 지정한다.

 <OL TYPE=A/a/l/i/1>.........</OL>

 시작되는 번호의 모양을 지정한다.
 * A : 대문자
 * a : 소문자
 * I : 큰 로마 숫자
 * i : 작은 로마 숫자
 * 1 : 표준 숫자(기본값)

 <UL>............</UL>

 목록에 번호를 붙이지 않고 나타낸다.

 <LI>

 각각의 목록을 지정한다.

 

 

 

 

 

 

 

8. 도표 만드는 태그

 태  그

 기  능

 <TABLE>.......</TABLE>

 도표를 만든다.

 <TR>.........</TR>

 도표의 가로줄을 지정한다.

 <TH>.........</TH>

 도표 안의 제목을 지정한다.

 <TD>.........</TD>

 도표 셀의 내용을 지정한다.

 <TABLE BORDER=숫자>......</TABLE>

 * 도표의 외각선이 주어진 숫자 두께로 만들어진다.
 * 만일 숫자를 지정하지 않으면 외각선의 두께는 1이 된다.

 <TABLE WIDTH=숫자/HEIGHT=숫자>....</TABLE>

 * WIDTH : 도표의 넓이를 지정한다.
 * HEIGHT : 도표의 높이를 지정한다.

 ROWSPAN = 셀의 개수

 세로로 된 셀을 개수만큼 합친다.

 COLSPAN = 셀의 개수

 가로로 된 셀을 개수만큼 합친다.

 <CAPTION>........</CAPTION>

 도표 바로위에 도표의 제목을 지정한다.

 ALIGN=left/center/right

 내용을 가로 위치에서 왼쪽/가운데/오른쪽 으로 정렬한다.

 VLIGN=top/middle/bottom

 내용을 세로 위치에서 위쪽/가운데/아래쪽 으로 정렬한다.

 

 

 

 

 

 

 

 


 

9. 프레임 만드는 태그

 태  그

기  능

 <FRAMESET ROWS/COLS ="화면을 나누는 비율">..........</FRAMESET>

 화면을 가로/세로 로 지정된 비율로 맛게 나눈다.

 <FRAME SRC="파일이름" NAME="이름">

 옵션 NAME를 사용해서 프레임에 이름을 지정한다.

 <A HREF="파일이름" TARGET="화면이름/_TOP/_BLANK">

 연결된 파일을 출력시킬 창의 위치를 지정한다.

 <FRAME NORESIZE>

 * 프레임 크기를 변경할 수 없다.
 * NORESIZE를 사용하지 않는 상태에서 마우스를 프레임의
    경계선으로 가져오면 프레임 크기를 변경할 수 있다.

 <FRAME SCROLLING="yes/no">

 프레임에 스크롤 바를 나타낼 것인지를 결정한다.

 <FRAMESET BORDER=경계선 굵기

 프레임의 경계선 굵기를 결정한다. 0 이면 경계선이 없어진다.

 
출처:태그사랑

profile 글쓴이 빽짱구

단점이 없는 사람은 장점도 거의 없다 - 에이브러햄 링컨

엮인글 :
https://web.webmini.net/webtip/13903/af1/trackback
소중한 댓글 부탁드립니다.
추천수 10단위당 메달이 1개씩 노출되고, 추천수에 따라 배경색이 변하며, 일정수의 추천수를 받을시 BEST 아이콘이 붙게됩니다.
추천수에 따른 배경색 보기 본문으로 바로가기
  • 추천수 50개이상
  • 추천수 30개이상
  • 추천수 20개이상
  • 추천수 10개이상
  • 추천수 3개이상
닫기

댓글 '2'

환상 (100993)

2009.09.17 21:21:17

감사합니다 짱구님~!
열혈개미 (208091)

2010.06.20 15:42:58

감사합니다.

List of Articles
번호 제목 글쓴이 날짜 추천 수 조회 수sort
186 소스 비교해 주는 사이트 title: [ani]깜빡이는 표정빽짱구 2018-10-20   206
185 괜찮은 구글 웹폰트 많네요. file title: [ani]깜빡이는 표정빽짱구 2018-10-23   209
184 웹사이트 속도 측정하고 개선해야 할부분 체크하세요. file title: [ani]깜빡이는 표정빽짱구 2018-10-19   212
183 seo 점수 알아보는 곳이라네요. title: [ani]깜빡이는 표정빽짱구 2018-10-11   220
182 페이스북 og 이미지 캐시 업데이트 title: [ani]깜빡이는 표정빽짱구 2017-07-10   260
181 카카오톡 미리보기 이미지 캐쉬 삭제 title: [ani]깜빡이는 표정빽짱구 2017-07-10   408
180 제가 쓰고 있는 플래쉬 코딩소스 title: [ani]방울UI 2012-05-09   1224
179 모바일화면 pc에서 확인하기 file title: [ani]깜빡이는 표정빽짱구 2013-12-03   2010
178 [스크랩] HTML5/CSS3 관련 팁 & 튜토리얼 title: 새싹사뎅이 2014-01-14   2065
177 best of best 휠을 움직이면 배경색이 바뀌고 클릭하면 원래색으로 title: [ani]깜빡이는 표정빽짱구 2004-02-29 27 2175
176 best of best 밑에 글 소스입니다. [1] title: [ani]깜빡이는 표정빽짱구 2004-02-22 20 2223
175 계산기 title: [ani]깜빡이는 표정빽짱구 2004-03-25 9 2241
174 자동으로 페이지 넘어가지 title: [ani]깜빡이는 표정빽짱구 2004-07-28 12 2246
173 best of best font 의 속성 [1] title: [ani]깜빡이는 표정빽짱구 2004-02-22 28 2258
172 포인트에 따른 자동레벨변경 title: [ani]깜빡이는 표정빽짱구 2004-03-29 16 2261
171 반응형 웹 참고 사이트(미디어쿼리) file title: [ani]깜빡이는 표정빽짱구 2013-06-03   2277
170 페이지확장 시키기 title: [ani]깜빡이는 표정빽짱구 2004-08-18 11 2340
169 리눅스 [Linux] [1] title: [ani]깜빡이는 표정빽짱구 2004-02-08 13 2341
168 트래픽을 제대로 알자! [1] title: [ani]깜빡이는 표정빽짱구 2004-03-08 10 2367
167 [re] (불투명결과) [1] title: [ani]깜빡이는 표정빽짱구 2004-02-29 12 2376