[GOGUMA AREA13] HTML 태그 명령어 모음
블로그 소개 2014. 12. 30. 09:12 |HTML 태그 명령어 모음
AREA 1/HTML5|CSS3 2011/04/09 15:11
HTML 태그 명령어 모음
형 식 | 구 성 | 내 용 |
문서의 기본 구조를 나타내 주는 태그 | ||
<HTML> | <HTML>... | HTML 언어로 작성되어 있다는 것을 알려줍니다. |
<HEAD> | <HEAD>... | Heading의 준말로 글의 머리말에 해당합니다. |
<BODY> | <BODY>... | 본문에 해당하는 부분을 알려줍니다. |
<TITLE> | <TITLE>... | 타이틀바에 새겨질 글자를 정의합니다. |
<Hn> | <Hn>... | 표제 부분에 들어갈 말을 정의합니다. 1~6까지의 숫자를 사용하고 숫자가 커질수록 표제는 작아집니다. 기본값은 H4입니다. |
<!-...-> | <!-주석내용-> | 주석을 달거나 잠시동안 이미지를 보이지 않게 할 때 사용합니다. |
문단 혹은 줄을 바꾸는 태그 | ||
<P> | <P> | 문단을 바꾸는 태그입니다. 줄바꿈과 동시에 줄을 띤 것같은 효과가 나타납니다. |
<BR> | <BR> | 문단을 바꾸는 태그입니다. 줄바꿈의 역할만을 수행합니다. |
<PRE> | <PRE>... | 여백이나 줄간격 등을 고정시켜 주는 역할을 합니다. |
글자의 크기를 마음대로 조절하는 태그 | ||
<FONT> | <FONT SIZE=n> ... | 글자의 크기를 마음대로 조절해 줍니다. 뒤의 숫자는 1~7이며 7이 가장 큰 크기입니다. 기본값은 3입니다. |
선그리기 태그 | ||
<HR> | <HR ALIGN= WIDTH= SIZE=> | 입체적인 선을 그려줍니다. ALIGN은 선의 정렬을, WIDTH는 선의 폭을, SIZE는 선의 높이를 정해줍니다. |
이미지 맵을 처리하는 태그 | ||
<ISMAP> | <IMG SRC= "..." ISMAP> | 이미지맵을 정의합니다. |
<MAP> | <MAP NAME=...> ... | 넷스케이프2.0에서 이미지맵을 정의합니다. |
목록을 정리해 주는 태그 | ||
<LI> | <UL>... | 순서가 없는 목록으로 일반적인 나열을 말합니다. |
<OL>... | 순서가 있는 목록으로 위에서부터 번호를 매깁니다. | |
<MENU>... | 메뉴 목록으로 그리길지 않은 문장의 열거에 사용합니다. | |
<DIR>... | 디렉토리 목록으로 메뉴 목록보다 짧은 문장을 나열합니다, | |
<DL>... | 정의 목록 태그입니다. | |
문서를 가운데로 정렬시켜 주는 태그 | ||
<CENTER> | <CENTER>... </CENTER> | 전체 문장을 가운데로 정렬시켜 줍니다. |
인용하기 태그 | ||
<BLOCKQUOTE> | <BLOCKQUOTE>... </BLOCKQUOTE> | 문장 내에서 인용을 할 경우 들여쓰기를 한 후 인용구로 처리합니다. |
형 식 | 구 성 | 내 용 |
글자의 모양을 정의해 주는 태그 | ||
<STRONG> | <STRONG>... | 굵은 글씨를 나타내 주는 태그입니다. |
<B> | <B>... | |
<EM> | <EM>... | 이탤릭체의 글씨를 나타내 주는 태그입니다. |
<I> | <I>... | |
<KBD> | <KBD>... | 타자기체의 글씨를 나타내 주는 태그입니다. |
<CODE> | <CODE>... | |
<TT> | <TT>... | |
배경 이미지 작업하기 | ||
<BODY> | <BODY BACKGROUND="..."> | 배경 이미지를 띄워줍니다. |
<BODY BGCOLOR="#nnnnnn"> | 배경 색깔을 지정해 줍니다. | |
그밖의 태그들 | ||
<DFN> | <DFN>... | 정의되어지는 단어에 대한 것을 말합니다. |
<CITE> | <CITE>... | 책이나 사진 등의 제목을 말할 때 쓰입니다. |
<SAMP> | <SAMP>... | 컴퓨터상에 메시지를 나탈낼 때 쓰입니다. |
<VAR> | <VAR>... | 이탤릭체로 표현됩니다. |
<SUB> | <SUB>... | 첨자에 관한 태그입니다. |
<SUP> | <SUP>... | 윗첨자를 나타냅니다. |
<BASEPOINT> | <BASEPOINT>... <BASEPOINT> | 기본적으로 미리 약속된 크기를 다시 정할 때 사용합니다. |
부분을 강조해 주는 태그 | ||
<BLINK> | <BLINK>... | 글자를 깜박이게 해줍니다. |
<U> | <U>... | 글자에 밑줄을 그어줍니다. |
연결하기 태그 | ||
<A> | <A HREF="..."> ... | 다른 홈페이지와 연결시켜 줍니다. |
<A NAME="..."> ... | 자신의 홈페이지 내에서 연결해 줍니다. | |
주소 및 편지 서비스 | ||
<ADDRESS> | <ADDRESS>... </ADDRESS> | 주소에 대한 정의를 내려줍니다. |
<MAILTO> | <A HREF="MAILTO..."> | 편지쓰기 창을 띄워 줍니다. |
색상 지정하기 | ||
<BODY> | <BODY TEXT= "#nnnnnn">... | 글자색을 지정합니다. |
<BODY LINK= "#nnnnnn">... | 하이퍼링크의 색을 지정합니다. | |
<BODY VLINK= "#nnnnnn">... | 한 번 누른적이 있는 하이퍼링크의 색을 지정합니다. | |
<BODY ALINK= "#nnnnnn">... | 누르고 있는 동안의 색을 지정합니다. | |
표 만들기 태그 | ||
<TABLE> | <TABLE BORDER>... </TABLE> | 표의 전체 형식을 나타냅니다. |
<TR> | ||
표 내부에 들어갈 형식을 정의합니다. | ||
<TD COLSPAN=n> | 가로칸을 n만큼 합쳐줍니다. | |
<TD ROWSPAN=n> | 세로칸을 n만큼 합쳐줍니다. | |
<TD ALIGN=...> | 표안의 좌우 정렬 방식을 정의합니다. | |
<TD VALIGN=...> | 표안의 상하 정렬 방식을 정의합니다. |
형 식 | 구 성 | 내 용 |
문서를 임의고 고정시키는 태그 | ||
<NOBR> | <NOBR>... | 화면 크기에 따라 문단이 바뀌는 것을 방지합니다. |
<WBR> | <WBR>... | 위의 태그 안에서 문단을 바꿀 때 사용합니다. |
CGI 양식 첨가하기 | ||
<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="..."> | 이미지가 전송되지 않았을 경우에 글자로 대처해 줍니다. |
<embed src= 음악 주소>
embed 는 음악을 삽입하라 라는 명령어 이지요
src 는 그 경로를 말하고요
여기에 몇가지가 추가될 수도 있습니다
첫번째, 음악을 자동으로 들을 것인가 수동으로 들을 것인가
a. 자동으로 들을려면.... autostart=true
b. 수동으로 들을려면.... autostart=false
두번째, 노래바를 감출 것인가 노출 시킬 것인가
a. 감출 경우..........hidden=true
b. 노출 시킬 경우.....width=100 height=20
(노래바의 크기임)
세번째, 한번만 들을 것인가,날 새도록 들을 것인가
a. 제한적으로 들을 때......loop=듣고 싶은 수
b. 날 새도록 듣고 싶을 때..loop=true
네번째, 통상적으로 볼륨은 0 으로 하세요
a. 볼륨.....volume=0
그러면 음악 태그를 다시 만들어 볼까요
*자동으로 듣고 노래바는 감추고 밤새도록 듣고 싶을 때
<embed src=음악주소 autostart=false hidden=true loop=true volume=0>
▶marquee: 왼쪽으로 움직이게 하는 명령어
▶direction: 움직임의 방향을 결정
▶scrollamount: 움직임의 속도결정(스크롤의 보폭)
▶loop: 얼마만큼 반복해 줄것인가를 결정케함
▶@: 글씨를 눕혀보이고자 할때
▶behavior=alternate: 움직이다 멈춤을 결정케함
▶width: 가로폭결정
▶height: 세로폭결정
▶font: 글꼴지정
▶font size: 글씨 크기결정
▶font color: 글씨 색 결정
▶font face: 글씨체 결정
▶background: 배경 그림 결정
▶bgcolor: 바탕색 결정
▶src: 경로/주소
▶img: 그림삽입
▶embed: 동영상,사운드 삽입
▶align=top: 정렬 위로
▶align=center: 정렬 중앙
▶align=bottom: 정렬 아래
▶br: 엔터 한번 효과
▶p: 엔터 두번 효과
▶(hr)..(/hr): 수평선 그리기
▶(u)..(/u): 밑줄 긋기
▶(b)..(/b): 굵은 글씨체 만들기
▶(ol)..(/ol): 목록 태그
▶(sub)..(/sub): 아래 첨자
▶(sup)..(/sup): 윗 첨자
▶(pre)..(/pre): 실제 그대로 브라우저 화면에 반응케함
▶alt: 그림설명
▶(table)..(/table): 표를 만들기 위한 태그
▶border: 테두리 두께 결정
▶(td)..(/td): 셀의 내용지정
▶(tr)..(/tr): td를 사용할때 시작과 끝남 결정
▶bordercolor: 테두리 색결정
▶cellspacing: 셀과 테두리와의 간격 결정
▶cellpadding: 셀과 셀에 입력된 데이터의 사이간결 결정
▶rowspan: 세로줄을 합치게 함
▶colspan: 가로줄을 합치게 함
▶html: html문서의 시작
▶head: html문서의 머리
▶(title)..(/title): html문서의 제목과 끝
▶(body)..(/body): html문서의 본문과 끝
▶/html: html문서의 끝
▶(a)..(/a): 하이퍼 텍스트 연결(링크)
▶glow: 필터속성중의 하나
▶shadow: 필터속성중의 하나
▶alpha: 필터속성중의 하나
▶glow: 필터속성중의 하나
▶blur: 필터속성중의 하나
▶wave: 필터속성중의 하나
▶xray: 필터속성중의 하나
▶invert: 필터속성중의 하나
▶gray: 필터속성중의 하나
▶(style=filter:fliph()).. (/span): 그림의 좌우바꾸기
▶(span style=filter:fliph ();height:1px;)...(/span): 글씨의 좌우바꾸기
▶(span style=filter:flipv();height:1px;): 글이나 그림 상하바꾸기
▶bordercolorlight: 테두리의 위쪽모서리색 지정
▶bordercolordark: 테두리의 아래쪽모서리색 지정
▶(frameset)..(frameset): 프레임을 어떻게 나눌지 결정
▶frameset cols: 창을 좌우로 나눔 결정
▶frameset rows: 창을 상하로 나눔 결정
▶(applet)..(/applet): 자바 애플릿 삽입
▶(script)..(/script): 자바 스크립트 삽입
'블로그 소개' 카테고리의 다른 글
[똔딴] 똔딴의 태국이야기 - 02 (0) | 2015.01.06 |
---|---|
[츄레비앙] 하연수 쇼핑몰 모델, 하연수 일반인 시절 : 네이버블로그 (0) | 2015.01.02 |
[아이툰 작가연합] 이성으로 비관하더라도 의지로 낙관하라 -홍세화- (0) | 2014.12.30 |
[K-POP Tune] เคป๊อปเนื้อเพลงไทย (0) | 2014.12.30 |
[베쯔니] 오키나와 아메리칸 빌리지의 크리스마스 일루미네이션 with EOS 6D (0) | 2014.12.29 |