<!DOCTYPE> |
HTML 언어의 버전 지정 |
||||||
<!-- --> |
주석문 |
||||||
<BODY> |
BACKGOUND |
배경그림 |
|||||
BGCOLOR |
배경색 |
||||||
TEXT |
기본 글자색(검정) |
||||||
LINK |
링크로 연결된 텍스트 색 |
||||||
ALINK |
링크로 연결된 부분을 클릭시 색 |
||||||
VLINK |
방문했던 링크의 색 |
||||||
BGPROPERTIES |
="FIXED" : 배경 이미지 고정 |
||||||
<H1~H6> |
H1 이 가장 큼, H6가 가장 작음 <H1>와 <FONT SIZE=6> 같은 크기 <H2>와 <FONT SIZE=5> 같은 크기 : <H6>와 <FONT SIZE=1> 같은 크기 |
||||||
<BASEFONT> |
|
기본 텍스트 설정 |
|||||
NAME |
글씨체 |
||||||
<FONT> |
SIZE |
글자 크기, 1이 가장 작음, 7이 가장 큼, 기준값=3 (+,-)를 이용하여 상대적 폰트크기 지정 |
|||||
COLOR |
글자색, <FONT COLOR="#000000"> : 검정색, <FONT COLOR="BLACK"> |
||||||
FACE |
글씨체 |
||||||
<BDO> |
DIR="RTL" |
글자 방향이 오른쪽에서 왼쪽으로 |
|||||
DIR="LTR" |
글자 방향이 왼쪽에서 오른쪽으로 |
||||||
<NOBR> |
문장이 긴 경우, 자동으로 다음 줄에 표시해 주는 것을 막을 때 사용 |
||||||
<BLOCKQUOTE> |
인용문 또는 들여쓰기를 할 때 사용 |
||||||
<EMBED> |
HTML 문서에서 사용할 수 없는 데이터를 플러그 인(Plug In)기능을 사용 |
||||||
<OBJECT> |
HTML 4.0에서는 멀티미디어 데이터를 효과적으로 사용 이미지, 동영상, 자바 애플릿 (Java Applet) 플러그 인 (Plug In) 데이터, 다른 HTML 문서 등을 HTML문서에 삽입 현재 데이터 형식마다 사용되고 있는 <IMG> <APPLET> <EMBED> <BGSOUND> 등을 통일해서 다룸 |
||||||
<P> |
단락 구분 └ <BR> 태그를 2번 사용한 것과 동일 └ 마감 태그(</P>) 없음 └ 여러 번 사용해도 한번 적용됨 |
||||||
<DIV> |
단락 편집 태그로 <P>태그와 유사 단, 각 문단 사이에 빈줄 추가되지 않음 - <P>태그와 차이점 |
||||||
<PRE> |
PREfromat 약자, <PRE></PRE>사이에 있는 문자열들의 공백, 줄 간격 그대로 화면에 출력 |
||||||
<XMP> |
<PRE></PRE>태그와 유사하지만, 태그까지도 그대로 화면에 출력 |
||||||
<HR> |
|
가로선(수평선) 표시 |
|||||
WIDTH |
선의 길이, 픽셀 또는 %로 표시 |
||||||
SIZE |
선의 두께 |
||||||
NOSHADE |
선의 입체감을 없앰 |
||||||
<B> |
굵은 글자 |
||||||
<I> |
이탤릭체 |
||||||
<U> |
밑줄 |
||||||
<S> |
취소선 |
||||||
<SUP> |
위첨자 |
||||||
<SUB> |
아래첨자 |
||||||
<MAP> |
<IMG> 태그로 삽입한 이미지에 맵처럼 어느 부분에 링크를 거는 태그 |
||||||
<IMG> |
SRC |
이미지 파일 경로 |
|||||
ALT |
그림에 마우스를 댔을 때 나오는 설명 문자열 지정 |
||||||
WIDTH |
가로 : 가로세로 어느 하나값만 변경해도, 같은 비율로 확대/축소가 이루어짐 |
||||||
HEIGHT |
세로 : 가로세로 어느 하나값만 변경해도, 같은 비율로 확대/축소가 이루어짐 |
||||||
<MAP> |
|
<AREA> 태그와 함께 이미지 맵을 만들 때 사용 이미지 맵을 사용하면 하나의 이미지 파일에 여러 개 링크 설정 가능 |
|||||
NAME |
맵 이름 |
||||||
<AREA> |
SHAPE |
RECT | CIRCLE | POLY : 사각형 | 원 | 다각형 |
|||||
COORDS |
영역의 좌표 |
||||||
HREF="" |
연결할 대상 |
||||||
|
ex) <img src="이미지 파일“ usemap="#맵이름”> <map name="맵이름“> <area shape="영역의 모양“ coords="영역의 좌표” href="연결할 대상> |
||||||
<BASE> |
|
상대경로의 기본위치를 변경 |
|||||
HREF="" |
경로 지정 ex) |
||||||
<A> |
HREF=“” |
연결시킬 문서, URL |
|||||
NAME |
현재 위치 저장 <A HREF="파일이름#위치이름“>문자열</A>로 지정한 위치로 이동 ex) <A NAME="Top"></A> <A HREF="#Top">위로</A> |
||||||
TARGET=_BLANK |
새로운 창 |
||||||
TARGET=_PARENT |
상위문서 창 |
||||||
TARGET=_TOP |
새로운 창(Frame 없어짐) |
||||||
TARGET=_SELF |
현재 창 |
||||||
<ADDRESS> |
이탤릭체로 표시 |
||||||
목록 태그 |
|||||||
<UL> |
|
Unordered List, 블릿 기호로 표시 |
|||||
TYPE=CIRCLE |
흰 원(○) 표시 |
||||||
TYPE=DISC |
검은 원(●) 표시, 기본값 |
||||||
TYPE=SQUARE |
검은 사각형(■) 표시 |
||||||
<OL> |
|
Ordered List, 순차적인 목록 작성 |
|||||
TYPE="1" |
숫자 1부터 시작, 기본값 |
||||||
TYPE="ⅰ" |
그리스 소문자 시작 |
||||||
TYPE="Ⅰ" |
그리스 대문자 시작 |
||||||
TYPE="a" |
소문자 a 시작 |
||||||
TYPE="A" |
대문자 A 시작 |
||||||
START |
시작 번호 지정(문자 값이 아닌 숫자값으로 지정) |
||||||
예시 |
<ol type="a" start=2> <li> aaaa <li> bbbb <li> cccc </ol> |
<출력결과>
|
|||||
VALUE="n" |
설정된 숫자부터 시작 |
||||||
<LI> |
<UL>, <OL> 태그 사이에서 목록을 만드는 독립태그 |
||||||
<DL> |
Definition List, 단어나 용어를 사용할 때 사용 |
||||||
<DT> |
Definition iTem, 정의 목록, <DL>태그 안에서 사용 |
||||||
<DD> |
정의 내용 서술, <DL>태그 안에서 사용 |
||||||
TABLE 태그 |
|||||||
<TABLE> |
CELLSPACING |
표 안의 셀 사이의 간격 |
|||||
CELLPADDING |
표 안의 내용과 테두리 사이의 간격 |
||||||
WIDTH |
가로 |
||||||
HEIGHT |
세로 |
||||||
BORDER |
테두리 선 두께 |
||||||
FRAME |
테두리 선의 표시 방법 |
||||||
<CAPTION> |
테이블의 제목 설정 |
||||||
<TR> |
|
Table Row의 약어 |
|||||
ALIGN |
="LEFT | CENTER | RIGHT" |
||||||
VALIGN |
="TOP | MIDDLE | BOTTOM" |
||||||
<TH> |
Table Header의 약어, 기본적으로 가운데 정렬, 굵은 글씨로 표시 |
||||||
<TD> |
|
Table Data의 약어 |
|||||
ROWSPAN=“n” |
셀 행을 n개 만큼 합침 |
||||||
COLSPAN=“n” |
셀 열을 n개 만큼 합침 |
||||||
FRAME 태그 |
|||||||
<FRAMESET> |
ROWS="n,n" |
상하 크기 나누기 (단위 : 픽셀 또는 % ) |
|||||
COLS="n,n" |
좌우 크기 나누기 (단위 : 픽셀 또는 % ) |
||||||
NORESIZE |
브라우저에서 프레임크기 변경하는 것을 금지 |
||||||
<FRAME> |
SRC="" |
파일경로 및 이름, 각각의 창에 연결될 HTML 파일 경로 및 이름 |
|||||
|
NAME="" |
창의 이름 설정, TARGET 속성으로 링크 연결할 때 사용 |
|||||
FORM 태그 |
|||||||
<FORM> |
METHOD |
="POST | GET" |
|||||
ACTION="" |
CGI Script 지정 |
||||||
TARGET=_BLANK |
새로운 창 |
||||||
TARGET=_PARENT |
상위문서 창 |
||||||
TARGET=_TOP |
새로운 창(Frame 없어짐) |
||||||
TARGET=_SELF |
현재 창 |
||||||
<TEXTAREA> |
<FORM>태그 안에서 텍스트 영역을 만듦, 여러 줄의 텍스트 입력을 받음 |
||||||
<INPUT> |
TYPE=TEXT |
텍스트 박스 작성, 한 줄의 텍스트 입력을 받음 |
|||||
TYPE=PASSWORD |
* 로 표시 |
||||||
TYPE=IMAGE |
그림보기 |
||||||
TYPE=FILE |
파일 |
||||||
TYPE=HIDDEN |
숨기기 |
||||||
TYPE=RADIO |
라디오 버튼, 여러 사항 중 하나만 체크 |
||||||
TYPE=CHECKBOX |
체크박스, 여러 개 선택 가능 |
||||||
TYPE=SUBMIT |
제출(스크립트 실행) |
||||||
TYPE=RESET |
취소(폼이 초기화됨) |
||||||
CHECKED |
미리 체크된 항목 지정 |
||||||
VALUE="" |
버튼의 이름을 표시, 버튼에 표시됨 |
||||||
스크롤메뉴 태그 |
|||||||
<SELECT> |
|
<FORM>태그 안에서 메뉴나 스크롤 형태의 선택 상자를 만듦 |
|||||
SIZE |
목록상자의 크기, SIZE가 기술되지 않은 경우 콤보박스 형태로 출력 |
||||||
MULTIPLE |
여러 개 항목 선택 |
||||||
<OPTGROUP> |
|
<SELECT>에 나열된 OPTION 항목들을 종류별로 구분하여 여러 개 그룹으로 나열할 때 사용 OPTGROUP 은 하나 이상의 OPTION을 포함해야 함. |
|||||
LABEL="" |
표시명 |
||||||
<OPTION> |
|
<SELECT>태그 안에서 각각의 선택사항을 정하는 독립 태그 |
|||||
VALUE="" |
각각의 값 |
||||||
LABEL="" |
표시명 |
||||||
SELECTED |
선택된 항목을 지정 |
||||||
<META> |
└ 홈페이지 제작자, 키워드, 정보의 이름과 내용 ex) <meta name="bakoon" content="test page"> └ HTML에서 사용하는 문자코드, 스타일 시트, 스크립트 언어 설정 ex) <meta http-equiv="Content-Type" content="text/html" ; charset=euc_kr"> └ 설정된 시간이 지나면 자동으로 다른 홈페이지 이동하기 ex) <meta http-equiv="refresh" content="3;url="http://a.com"> |
'Study > Frontend' 카테고리의 다른 글
HTML <!DOCTYPE> 선언 (0) | 2020.12.01 |
---|---|
[HTML5&CSS3] : 태그 속성 (0) | 2020.11.27 |
[HTML&CSS] 태그 (0) | 2020.11.25 |
[HTML] 요소 정리 (0) | 2020.11.24 |
[JS] 자바스크립트 Math 객체 - Math, abs, ceil, floor, max, min, pow, random, round, sin, sqrt (0) | 2020.10.19 |