2012. 4. 25. 12:53ㆍNOTE/IT
HTML 종합 문법
----------버튼 --------------------------
소스
<input type="button" value="이쁜 버튼" style="color:white; font-size: 9pt;
background-color:pink; border:1 solid red;size= 30;height:20px"></style>
소스
<input type="button" value="이쁜 버튼" style="color:white; font-size: 9pt;
background-color:00ccff; border:1 solid blue;size= 30;height:20px"></style>
버튼응용에서 연결까지
<form action="연결시킬주소" target="_blank">
<input type="submit" value="버튼이름" style="color:white; font-size: 9pt;
background-color:pink; border:1 solid red;size= 30;height:20px"></style>
</form>
-----------------------------------------------------
-e : explorer -n : netscape -H2 : html 2.0 -H3 : html 3.2 -x : 확장태그
<A>
하이퍼링크
H2
href="URL"
하이퍼링크로 호출되는 파일
H2
name="이름"
중간 부분을 지정하기 위한 HTML 도큐먼트 부분 명명.
H2
taget="_blank" , "_parent" , "_self" "_top"
대상(타겟) 프레임 지정(새창/상위/현재/전체페이지)
x
<APPLET>
페이지에 자바 애플릿을 삽입
H3
align="left" , "right" , "top" , "middle" "bottom"
에플릿의 출력 내용이 윈도우에 정렬되는 상태
H3
alt="텍스트"
애플릿이 제대로 로드되지 않을 경우에 표시되는 텍스트
H3
code="URL"
자바 애플릿의 이름
H3
codebase="URL"
에플릿이 저장되어 있는 디렉토리
H3
height=수치,width=수치
애플릿의 출력 내용의 가로와 세로 픽셀 크기
H3
hspace=수치, vspace=수치
애플릿과 그 주변 텍스트 사이의 가로와 세로 공간으로, 픽셀값으로 나타냄
H3
name=명칭
페이지상의 다른 에플릿들이 이 에플릿을 참조할 수 있는 이름
H3
<AREA>
<MAP>태그로 제작된 이미지 맵 내에 링크 영역을 지정
H3
alt="텍스트"
텍스트 브라우저에 표시될 텍스트
H3
coords="좌표1.좌표2,좌표3..."
영역의 경계선에 대한 좌표(각 형태는 좌표들을 지정하는데 나름대로의 규칙이 있다.)
H3
href="URL"
링크된 파일의 URL
H3
nohref
링크를 갖고 있지 않도록 하는 영역을 정의
H3
shape="rect" , "circle" , "poly"
정의될 형태의 유형
H3
target="_blank" , "_parent" , "_self""_top"
프레임과 함께 사용되는, 링크된 파일이 표시되어야 하는 프레임이나 윈도우의 이름을 나타냄
x
<B>
볼드체로 설정할 텍스트를 표시
H2
<BASEFONT>
제목에 이용되는 기본 글꼴 지정
x
color="#RRGGBB" 또는 "색이름"
텍스트의 색상으로, 16진수의 RGB값이나 색상명으로 나타냄
x
face="글꼴명"
글꼴 이름
x
size="크기"
1에서 7까지의 글자크기. 3이 초기값임. 1에서7까지는 절대 수치이고, -1에서 +3까지는 상대크기.
N
<BGSOUND>
파일이 로드될 때, 음악이 재생됨
e
loop=수치 or "infinite"
사운드 클립이 반복되는 횟수/loop=1 로 지정하면 한 번만 재생/지정안하면 무한
e
src="URL"
사운드 파일의 주소를 지정
e
<BIG>
큰 크기로 텍스트를 나타냄
H3
<BLOCKQUOTE>
들여 쓴 텍스트를 나타냄
H2
<BODY>
브라우저에 표시될 부분을 지정
H2
alink="#FFFFFF" or "색의 영문이름"
클릭된 링크의 색상, 16진수의 RGB값이나 색이름/#은 생략가능하나 쓰는게 정석
H3
background="URL"
배경으로 사용될 이미지파일/주로 JPG포맷을 사용..BMP는 용량이 넘 크다
H3
bgcolor="#FFFFFF" or "색의 영문이름"
배경색
H3
bgpropertes="fixed"
배경 이미지가 스크롤되지 않음
e
leftmargin=수치
왼쪽 여백 크기, 픽셀 수
e
link="#FFFFFF" or "색이름"
하이퍼 링크의 색상
H3
tx="#FFFFFF" or "색이름"
일반적 텍스트의 색상
H3
topmargin=수치
상단의 여백, 픽셀수
e
vlink="#FFFFFF" or "색이름"
방문한 링크의 색상
H3
<BR>
행분리/여는 태그만 있다..</br>은 <br>과 동일한 효과
H2
<CENTER>
가운데 정렬/</center>로 반드시 마감..안하면 이후 모두 중앙정렬
H3
<CITE>
인용문을 설정
H2
<CODE>
컴퓨터 코드로 텍스트를 나타냄
H2
<DD>
정의 목록에서 정의문으로 설정될 텍스트를 나타냄(<DL> 과<DT>와 함께 사용해서)
H2
<DFN>
정의문을 설정
H3
<DIR>
세로 방향으로 놓여지는 리스트를 만든다(20항목까지)
H2
<DIV>
요소들의 세트를 그룹짓는데, 그 속성들을 적용시킴
H3
align="left" , "right" , "center"
픽셀 수로 나타낸 상단의 여백
H3
<DL>
정의 목록을 만든다
H2
<DT>
정의 목록에서 용어로서 설정될 텍스트를 나타냄
H2
<EM>
강조될 텍스트를 나타냄
H2
<EMBED>
페이지에 플러그 인을 삽입
x
height=수치, width=수치
가로와 세로 크기, 픽셀값
x
name="이름"
다른 오브젝트들이 이것을 참조하는데 사용되는 이름
x
param="값"
프로그램에서 매개 변수로 지정되는 값
x
src="URL"
플러그 인이 출력할 파일
x
<FONT>
특별한 글자 속성으로 텍스트를 나타냄
H3
color="#RRGGBB"또는 "색이름"
텍스트의 색, 16진수의 RGB값이나 색상명
H3
face="글꼴명"
글꼴 이름/ @굴림...@ 들어 가면 90도 회전 글꼴
x
size="크기"
1에서 7까지의 글자 크기, 초기값은 3
-1에서 +3은 상대적인 크기임
H3
<FORM>
폼을 작성함
H2
action="URL"
전송 버튼을 클릭하면,작동되고, 양식 데이터가 보내져야 하는 스크립트
H2
method="get" , "post"
데이터를 보내는 방식을 규정
H2
<FRAME>
프레임 세트 내의 각각의 프레임의 속성들을 규정
x
frameborder=1 , 0 or "yes" , "no"
프레임 주위에 테두리를 설정하거나(1또는 yes)삭제해 버림(0또는 no).(MS사의 브라우저는 숫자를 사용하고,Netscape는 단어를 사용.)
x
marginheight=수치
프레임들 사이의 공간으로, 픽셀값으로 나타냄.
x
marginwidth=수치
프레임내에 여백을 만든다(픽셀값으로 규정)
x
name="이름"
프레임에 대한 타겟명(<A >와 <AREA>태그를 사용하여 그 특정 프레임으로 강조된 파일들을 보냄)
x
noresize
유저가 프레임 크기를 바꾸지 못함
x
scrolling="yes" ,"no" , "auto"
스크롤 바를 포함시키거나 없애 버림. 초기값에("auto")은 프레임의 내용들이 테두리 밖으로 넘어갈 때만 스크롤 바가 나타남
x
src="URL"
프레임에 놓여질 파일의 URL
x
<FRAMESET>
프레임 세트를 만드는 태그들을 표시
x
cols="col1,col2,col3..."
"단" 세트로서 프레임세트를 설정. 단의 세트는 각각에 폭을 지정하여 나타냄. 폭은 픽셀값으로 지정되는데, 윈도우 크기에 대한 백분율로 또는 그 단이 나머지 공간을 차지한다는 표시인 별표(*)로서 나타냄.한 개 이상의 단이 별표로 지정되면, 그 공간은 균일하게 그 단의 수로 나뉘게 된다.
x
rows="row1,row2,row3..."
"열"의 세트로서 프레임 세트를 설정. 열의 세트는 각각의 높이를 지정하여 나타냄. 높이는 픽셀값으로 지정되는데, 윈도우 크기에 대한 백분율 또는 그열이 나머지 공간을 차지한다는 표시인 별표(*)로서 나타냄. 한개 이상의 단이 별표로 지정되면 그 공간은 균일하게 그 단의 수로 나뉘게 된다.
x
frameborder=1 , 0 or "yes" , "no"
프레임 세트 주위에 테두리를 설정하거나(1또는 yes)없애 버림(0또는 no)(MS사의 브라우저는 수치를 사용하고, Netscape사 것은 단어를 사용.)
x
<H1>
텍스트 1단계 제목으로 나타냄(가장 큰 제목 크기)
H2
<H2>
텍스트 2단계 제목으로 나타냄
H2
<H3>
텍스트 3단계 제목으로 나타냄
H2
<H4>
텍스트 4단계 제목으로 나타냄
H2
<H5>
텍스트 5단계 제목으로 나타냄
H2
<H6>
텍스트 6단계 제목으로 나타냄
H2
<HEAD>
HTML 문서의 제목 태그를 나타냄
H2
<HR>
가로선을 만든다
H2
align="left"또는 "right" 또는 "center"
문서에서 괘선의 정렬 상태
H3
color="#RRGGBB" 또는 "색이름"
괘선의 색, RGB값이나(16진수) 색이름
e
noshade
괘선에 대한 초기값인 3D음영을 없앰
H3
size=수치
괘선의 길이, 픽셀값
H3
width=수치
괘선의 폭, 픽셀값
H3
<HTML>
HTML 문서임을 나타냄
H2
<I>
이탤릭체로 텍스트를 나타냄
H2
<IMG>
이미지나 비디오 클립을 삽입
H2
align="top" , "middle" , "bottom" , "left" , "right" , "center"
문서속에서 이미지나 비디오 클립의 정렬상태
H3
alt="텍스트"
텍스트 전용 브라우저나 제대로 로드되지 않을 경우에 표시될 텍스트
H2
border=수치
테두리의 폭, 픽셀값(초기값은 border=1)
H3
controls
비디오 조절, dynsrc=과 함께 사용됨
e
dynsrc="URL"
삽입될 AVI파일을 지정
e
height=수치,width=수치
이미지나 비디오 클립의 가로와 세로 크기, 픽셀값
H3
hspace=수치,vspace=수치
주변 텍스트와 사이의 가로와 세로 공간, 픽셀값
H3
ismap
이미지가 서버 측 이미지 맵임을 지정
H2
loop=수치 또는 "infinite"
dynsrc=와 함께 사용, 비디오 클립이 반복되는 횟수
e
src="URL"
삽입될 이미지의 URL
H2
start="fileopen" , "mouseover"
dynsrc=와 함께 사용, 비디오 클립이 작동되게 해주는 이벤트
e
uesmap="#이름"
클라이언트 측 이미지 맵으로 사용될 맵의 명칭, 이 이름은 <MAP> 태그의 name=속성이 지정하는 것이다
H3
<INPUT>
폼내에 입력 요소를 만든다
H2
type="tx" , "button" , "checkbox" , "radio" , "submit" , "image" , "reset" , "hidden"
삽입할 입력 요소의 유형
H2
checked
type=checkbox, radio에 대하여, 초기값으로 선택해 놓을 상자나 버튼을 지정
H2
maxlength="길이"
type=tx에 대하여, 엔트리의 최대 길이, 글자 수
H2
name="이름"
입력 내용이 CGI 등으로 보내질 때 변수명으로 사용되는 제어의 이름
type=radio에 대하여, 그룹내의 모든 라디오 버튼들은 똑같은 이름을 갖고 있음
H2
size="크기"
type=tx에 대하여, 텍스트 상자의 길이
H2
src="URL"
type=image에 대하여, 버튼으로 사용되는 이미지를 나타냄
H2
value="이름"
type=checkbox : 상자가 체크되면 보내지는 변수 값.
type=tx : 텍스트 란에 들어 있는 초기 값.
type=submit, reset, button : 버튼 위에 표시된 텍스트
H2
<KBD>
키보드 입력으로 설정될 텍스트
H2
<LI>
목록에 새로운 항목을 만든다(<DIR>,<MENU>,<OL>,<UL>과 사용)
H2
type="A" , "a" , "I" , "i" , "disc" , "circle" , "square"
항목에 대한 수치나 방점 스타일을 지정
x
value=수치
<OL>과 함께 사용되는데, 그 항목에 대한 수치
x
<MAP>
클라이언트 측 이미지 맵 지정 (<IMG>태그의 usemap=속성으로 참조)
H3
name="이름"
맵에 이름을 붙여 줌
H3
<MARQUEE>
화면위로 텍스트를 스크롤
e
align="top" , "middle" , "bottom"
문서에서의 정렬 상태를 지정
e
behavior="scroll" , "slide" , "alternate"
스크롤 행동을 지정: 기본값/움직인후 멈춤/좌우왕복
e
bgcolor="#RRGGBB" or "색상명"
배경색 지정, RGB값이나 색상명을 사용
e
direction="left" , "right"
스크롤 방향
e
height=수치 or %, weight=수치 or %
가로와 세로 크기, 픽셀 또는 백분율로 지정
e
hspace=수치, vspace=수치
주변 텍스트 사이의 가로와 세로 공간, 픽셀값
e
loop=수치 or "infinite"
반복 횟수
e
scrollamount=수치
텍스트가 이동할 간격 크기를 픽셀 단위로 지정(0-99999)
e
scrlldelay=수치
텍스트가 움직이기 시작할때까지의 지연시간을 밀리초 단위로 지정(0-99999)
e
<MENU>
메뉴 목록을 만든다
H2
<META>
HTML 문서에 대한 일반적 정보를 제공
H2
content="값"
HTTP 행동을 위해 http-squiv으로 지정된 용도의 값. 자동 페이지 로드시 기다리는 시간을 초 단위로 나타냄
x
http-equiv="http 행동"
규정해 놓아야 할 HTTP행동. 자동 페이지 로딩시에는, http-equiv="refresh"를 사용
x
url="URL"
http-equiv="refresh"와 함께 사용되는데, 다음에 로드될 파일을 나타냄
x
<MULTICOL>
다단에 설정될 텍스트
N
cols=수치
단의 수
N
gutter=수치
단들 사이의 간격, 픽셀값
N
width=수치
단의 폭, 픽셀값
N
<NOBR>
행분리시켜서는 안될 요소들을 연결
x
<NOEMBED>
플러그 인을 지원하지 않는 브라우저들에 표시될 내용을 나타냄.
x
<NOFRAMES>
프레임을 지원하지 않는 브라우저들에 표시될 내용을 나타냄.
x
<NOSCRIPT>
스크립트 언어를 지원하지 않는 브라우저들에 표시될 것을 나타냄.
x
<OBJECT>
이미지, 매체 파일, 프로그램 등의 오브젝트를 삽입
x
align="left" , "right" , "center" , "top" , "middle" , "bottom"
문서에서 오브젝트의 정렬 상태
x
border=수치
오브젝트 주위의 테두리의 폭, 픽셀값
x
classid="class 지정자"
플러그 인이나 프로그램에 대한 지정(삽입될 오브젝트의 유형에 따라 달라짐)
x
codebase="URL"
프로그램을 담고 있는 디렉토리
x
codetype="MIME 유형"
프로그램의 MIME 유형
x
data="URL"
페이지에 삽입될 오브젝트의 URL
x
height=수치,width=수치
오브젝트의 가로와 세로 크기, 픽셀값
x
hspace=수치,vspace=수치
오브젝트와 주변 텍스트 사이에 가로와 세로 간격, 픽셀값
x
name="이름"
다른 프로그램들이 그 오브젝트를 참조하는데 사용하는 이름
x
shapes
이미지 맵에서처럼 오브젝트가 하이퍼 링크 형태가 되도록 지정
x
standby="텍스트"
오브젝트가 로드되는 동안에 디스플레이되는 텍스트
x
type="MIME 유형"
오브젝트의 MIME유형.
x
usemap="이름"
클라이언트 측 이미지 맵의 이름.
x
<OL>
번호가 붙은 목록을 만든다
H2
type="A" , "a" , "I" , "I"
번호의 종류를 지정: A는 대문자, a는 소문자, I는 대문자형의 로마숫자, i는 소문자형의 로마 숫자.
H3
start=숫자
시작번호를 지정
H3
<OPTION>
메뉴에 옵션을 만든다, <SELECT>태그 뒤에 사용
H2
selected
초기값으로 선택될 옵션을 지정
H2
value="텍스트"
옵션을 선택하면 보내지는 값
H2
<P>
단락 분리/중간에 빈줄이 생김..<br>과 마찬가지로 닫는 태그 없음
H2
align="left" , "right" , "center"
문서에서의 단락의 정렬 상태
H3
<PARAM>
프로그램에 매개 변수를 전달, <OBJECT>나<APPLET> 태그와 함께 사용됨
H3
name="명칭"
값이 배정될 매개변수의 이름
H3
value="값"
매개 변수의 값
H3
valuetype="data" , "ref" , "object"
값이 해석되는 방법을 나타냄:data는 초기값이고, ref는 URL,object는 같은 도큐먼트에서의 오브젝트의 URL
H3
type="MIME유형"
데이터의 MIME 유형
H3
<PRE>
태그가 무시된 텍스트를 나타냄
H2
<S>
밑줄체 텍스트 (<STRIKE>와 동일)
H2
<SAMP>
견본으로 설정될 텍스트를 나타냄
H2
<SCRIPT>
스크립트 언어를 나타냄
H3
language="명칭"
스크립트가 쓰여질 언어를 지정
H3
scr="URL"
외부 스크립트 파일을 지정
N
<SELECT>
선택 메뉴를 만든다
H2
Multiple
스크롤 메뉴에 복수 선택 기능을
H2
name="이름"
입력내용이 CGI 등 으로 보내질 때 변수명으로 사용되는 이름을 만든다
H2
size="크기"
지정된 크기로 스크롤 메뉴를 만든다
H2
<SMALL>
작은 크기로 텍스트를 나타냄
H3
<SPACER>
페이지에 빈 공간을 만든다
N
align="left" , "right"
type=block 일때 ,공간 주위의 왼쪽이나 오른쪽을 텍스트로 둘러쌈
N
height=수치, width=수치
type=block 일때 ,빈 공간의 가로와 세로크기, 픽셀값
N
size=수치
type=horizontal , type=vertical 일때 , 빈공간의 크기, 픽셀값
N
type="horizontal" , "vertical" , "block"
horizontal은 현재 행에 공간을 만들어 주고, vertical은 다음 항목 위에 세로로 공간을 만들어 주며, block은 사각형의 공간을 만든다
N
<STRIKE>
밑줄체 텍스트 (<S>와 동일) x 가나다
H3
<SUB>
아래첨자로 텍스트를 나타냄 x 가나다
H3
<SUP>
위첨자로 텍스트를 나타냄 x 가나다
H3
<TABLE>
테이블 지정
H3
align="left" ,"right" ,"center"
문서에서의 정렬 상태를 지정
H3
bgcolor="#FFFFFF" or "색이름"
표의 배경색
x
border=수치
행의 테두리의 두께, 픽셀값
H3
bordercolor="#FFFFFF" or "색이름"
테이블의 테두리 색
e
cellpadding=수치
각 셀의 테두리와 그 내용 사이의 간격, 픽셀값
H3
cols=수치
테이블에서 단의 수
H3
width=수치 또는 %
테이블의 전체 폭으로, 픽셀값이나 윈도우 크기에 대한 백분율로 지정
H3
<TD>,<TH>
테이블의 셀에 들어갈 데이터<TD>와 제목<TH>를 나타냄
H3
align="left" , "right" , "center"
셀에서의 데이터의 정렬 상태를 지정
H3
bgcolor="#FFFFFF" or "색이름"
셀의 배경색
x
bordercolor="#FFFFFF" or "색이름"
셀의 테두리 색
e
colspan=수치
셀이 펼쳐져 있는 단의 수
H3
height=수치
표의 셀의 높이로, 픽셀값으로 나타냄
H3
nowrap
셀에서 행을 감싸지 못하게 함
H3
nowspan=수치
셀이 펼쳐져 있는 행의 수
H3
valign="top" , "middle" , "bottom" , "baseline"
셀의 테두리에 대한 셀의 내용들의 세로 정렬 상태
H3
width=수치
셀의 폭으로, 픽셀값이나 표의 크기에 대한 백분율로서 지정
H3
<TEXTAREA>
여러 행의 텍스트 입력란을 만든다
H2
cols=수치, rows=수치
텍스트 영역의 폭(row)과 높이(cols)
H2
name="이름"
텍스트 영역의 이름으로, 입력 내용을 CGI로 보내질 때 변수 이름으로 사용됨
H2
<TR>
테이블에서 새로운 행을 만든다
H3
align="left" 또는"right" or "center"
가로 방향으로 높여진 셀들의 내용들의 정렬 상태
H3
bgcolor="#FFFFFF" or "색이름"
표의 행의 배경색
x
bordercolor="#FFFFFF" or "색상명"
행의 테두리 색상
e
valign="top" , "middle" , "bottom" , "baseline"
셀의 테두리에 대한 행의 내용들의 세로 정렬 상태
H3
<TT>
고정 크기 서체로 텍스트를 나타냄
H2
<U>
밑줄이 쳐질 텍스트를 나타냄
H2
<UL>
방점이 찍힌 무순서 리스트를 만든다
H2
type="disc" , "circle" , "square"
방점의 형태
x
<VAR>
변수로 설정될 텍스트를 나타냄
H2
'NOTE > IT' 카테고리의 다른 글
| [JAVA SCRIPT]팁 모음 (0) | 2012.04.25 |
|---|---|
| [PHP]문자열을 정해진 길이로 나누어 배열 만들기 (0) | 2012.04.25 |
| [JAVA SCRIPT]alert(),confirm(),prompt() (0) | 2012.04.25 |
| [JAVA SCRIPT] 함수,기본 문법 (0) | 2012.04.25 |
| [JAVA SCRIPT]문자열 검색 (0) | 2012.04.25 |