DocumentTypeDefinition

HTML이나 XHTML과 같은 마크업 문서는 문서가 시작할 때 문서형 선언(Document Type Definition)을 명시하여 문서에 사용되는 마크업을 파서(parser)가 파악할 수 있게 해야 한다. 문법 검사기(validator)도 이 DTD를 기준으로 마크업에 사용된 태그나 속성이 정확한지를 검사한다. 모든 마크업 문서는 이 DTD를 명시해 주어야만 한다.

DTD의 종류

웹에서 사용하는 마크업 언어는 HTML 4.01과 XHTML 1.0, XHTML 1.1이 있다. 각 마크어 언어는 특징에 따라서 트랜지셔널(Transitional), 스트릭트(Strict), 프레임셋(Frameset)으로 세분화 된다. 트랜지셔널은 디자인적인 속성이 포함된 DTD이고 스트릭트는 디자인 적인 속성이 모두 제거된 형식이다. <a>에 타겟(target)속성을 이용하거나 <td>에 너비(width), 높이(height) 등의 속성을 사용하기 위해서는 트랜지셔널 DTD를 사용해야 한다. 프레임셋은 트랜지셔널 DTD에 프레임을 사용할 수 있게 프레임 관련된 선언을 포함한 DTD이다.

HTML 4.01 Strict DTD

<!DOCTYPE 
HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" 
"http://www.w3.org/TR/html4/strict.dtd">

HTML 4.01 Transitional DTD

<!DOCTYPE 
HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" 
"http://www.w3.org/TR/html4/loose.dtd">

HTML 4.01 Frameset DTD

<!DOCTYPE 
HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" 
"http://www.w3.org/TR/html4/frameset.dtd">

XHTML 1.0 Strict DTD

<!DOCTYPE 
html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

XHTML 1.0 Transitional DTD

<!DOCTYPE 
html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

XHTML 1.0 Frameset DTD

<!DOCTYPE 
html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">

XHTML 1.1 DTD

<!DOCTYPE 
html PUBLIC "-//W3C//DTD XHTML 1.1//EN" 
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

DTD의 선택

문서의 DTD를 선택할 때에 사용되는 절대적인 기준이 있는 것은 아니고 저작자의 판단에 전적으로 의존하게 된다. 문서의 저작 환경을 고려하고 향후 관리를 하는데 용이하도록 DTD를 정하면 된다. 보통 제작 이후에 어떠한 사람들이 사이트를 유지, 관리하고 표준의 준수에 대한 의지가 어느정도인가에 따라서 DTD를 결정하게 된다. 예를 들어서 유지, 관리 하는 인원이 타겟 속성을 사용한다든가 높이, 너비를 마크업 언어에 직접 명시하고자 한다든가, 모든 인원들이 웹표준을 완전히 익히기가 힘든 상황이라면 XHTML DTD를 선택하기 보다는 HTML DTD를 선언하여 사용하는 것이 바람직하다.

HTML 4.01 트랜지셔널(Transitaional)이라고 해서 XHTML 1.1보다 못하거나 수준이 낮은, 또는 웹표준이 아닌 것은 아니다. 상황에 맞는 DTD를 선택하고 선택한 DTD를 완벽하게 준수하는 것이 중요하다.

처음 접근하기 쉬운 DTD

웹표준을 처음 접할 때에는 XHTML을 선택 하는 것 보다는 HTML 4.01 트랜지셔널을 선택하고 문법을 완전히 지킬 수 있게 노력하는 것이 더 좋은 선택이다. 문법검사기를 완전히 통과하지 않는 문서는 CSS를 적용하여 제작했다고 해도 완벽하다고 할 수가 없다.

마임타입(mime-type)과 DTD

XHTML의 경우 문서의 마임타입이 application/xhtml+xml로 제공이 되어야 한다. XHTML 1.0에서는 하위 호환성을 위해서 text/html로 전송하는 것도 허용하고는 있지만 XHTML1.1은 반드시 application/xhtml+xml로 배포 되어야 한다. 이러한 의미에서 본다면 XHTML보다는 HTML 4.01 Strict가 더 좋은 선택이 될 수도 있다.

DTD와 랜더링 모드

이론적으로 DTD와 랜더링은 전혀 무관하지만 요즘의 브라우저들은 DTD에 따라서 랜더링을 다르게 한다. 표준 방식으로 랜더링을 할 경우, 기존의 비표준 방식의 랜더링에서 잘 나오던 웹페이지가 잘못 랜더링 될 수가 있기 때문에 표준 방식으로 랜더링 할지, 비표준 방식으로 랜더링 할지를 이 DTD선언을 참조하여 결정하게 된다.

표준방식 랜더링과 비표준방식 랜더링이 가장 차이가 많이나는 브라우저는 인터넷 익스플로러이다. 인터넷 익스플로러는 레이아웃 제작이나 위치를 설정하는데 영향을 크게 미치는 박스모델이 랜더링 모드에 따라서 차이가 크다. CSS에서 말하는 박스모델에서는 너비(width)는 콘텐츠가 들어가는 영역의 너비를 의미하는데 인터넷 익스플로러의 비표준 방식 랜더링에서는 너비를 콘텐츠의 너비 + 안쪽 여백(padding) + 경계선(border)으로 정의하고 있다. 그래서 어느 DTD를 선택하는지에 따라서 안쪽 여백이나 경계선을 사용한 부분의 디자인이 많이 달라지게 된다.

인터넷 익스플로러에서 랜더링 엔진을 변경하는 기준은 MSDN(CSS Enhancements in Internet Explorer 6)에 잘 나와있다. HTML 4.0 트랜지셔널과 프레임셋의 경우 DTD URL이 있는지 없는지에 따라서 랜더링 모드가 바뀌게 되기 때문에 주의해야 한다.

인터넷 익스플로러의 경우 랜더링 모드에 따라서 캔버스영역이 바뀌기 때문에 주의해야 한다. 비표준방식에서는 캔버스를 이루는 요소가 <body>이지만 표준방식에서는 <html> 요소가 캔버스가 된다. 그래서 스크롤바의 디자인 적용도 <body>가 아닌 <html>로 해야하고 캔버스영역의 값들도 document.body가 아닌 document.documentElement에서 참조 하여야 한다. 스크립트에 대한 자세한 사항은 QuriksMode의 document.body and doctype switching에 상세하게 나와있다.

관련링크: DTD (Document Type Definition) by 1upz

'프로그래밍 > Html' 카테고리의 다른 글

table, tr, td 속성 (0)	2009.02.11
table display Example (0)	2009.02.11
Div 와 Span (0)	2009.02.11
색상표코드 알아보는 프로그램 (0)	2009.02.11
css !important (0)	2009.02.11

시작하기 전에.. 'Div와 Span 태그'란?

* 공간을 지정하고 style을 적용하는 태그로서 공간을 지정하는 것에 대해서는 fieldset도 마찬가지이기에 함께 다루도록 하겠다.

* div와 span의 경우 공간을 지정하는 것에서는 거의 같은 역할을 하지만 실상 미세한 부분에서 차이가 있다. 그 차이점을 알아보고, div와 span 그리고 fieldset을 공간을 담는 상자로 이해하고 시작하는 것이 빠르다.

* 공간에 관한 태그로서 대표적으로 table 태그가 있다. table은 하나의 공간을 <td></td>로 나누고 이 <td></td>를 묶어 놓은 집합체이다. 반면 div, span, fieldset은 그 각각이 하나의 공간을 이룬다.

* 또한 table의 경우 td의 크기를 먼저 계산한 후 table을 보여주는 방법을 취하지만, div, span, fieldset은 바로 보여지기에 렌더링에도 table보다 뛰어나다.

* div, span, fieldset 세 태그 모두 특별한 속성은 없으며, style 속성에 사용되는 요소로서 형태와 기능이 달라진다.

Div 태그

* Division의 약자로 시작태그 <div 속성="요소">와 종료태그</div>로 구성된다.

* 태그내에 속성을 적지 않아도 시작태그와 종료태그 사이에 들어가는 내용에 따라 그 공간의 크기도 저절로 달라진다.

* 그 공간은 줄 단위로 할당되어 태그의 시작 전후에 자동으로 줄바꿈 기능을 가지고 있다.

* 대표적으로 사용되는 속성으로는 style 속성이 있는데 span과 fieldset도 공통으로 사용되는 속성이기에 3가지 태그의 소개후에 style 속성을 따로 다루도로 하겠다.

Span 태그

* 시작태그 <span 속성="요소"> 종료태그</span>으로 구성된다.

* 태그내에 속성을 적지 않아도 시작태그와 종료태그 사이에 들어가는 내용에 따라 그 공간의 크기도 저절로 달라진다.

* 그 공간은 내용에 국한되며, div와 달리 태그의 시작 전후에 자동 줄바꿈 기능이 없어 연속으로 사용하면 이웃하게 위치한다.

* span 태그는 연속 사용시 이웃하는 성질을 가지고 있기에 글씨에 관한 style을 적용할 때 많이 사용되는 태그이다.

Fieldset 태그

* 시작태그인 <fieldset 속성="요소">와 종료태그 </fieldset>으로 구성되어 있다.

* div와 span과 다르게 테두리가 존재하며 모서리 부분이 둥근것이 하나의 특징이다.

* 또 하나의 특징이라면, <legend align="left/right/center">제목</legend>를 삽입하여 제목을 추가할 수 있다.

* 태그내에 속성을 적지 않아도 시작태그와 종료태그 사이에 들어가는 내용에 따라 그 공간의 크기도 저절로 달라진다.

* div와 마찬가지로 그 공간은 줄 단위로 할당되어 태그의 시작 전후에 자동으로 줄 바꿈 기능을 가지고 있다.

공통적으로 사용되는 style 속성

* div, span, fieldset 태그는 style 속성에 따라 그 크기와 모양 그리고 기능이 달라진다.

* style 태그의 속성들은 따로 자세히 배우도록 하고 여기서는 가장 많이 사용되는 몇가지만 알아보자.

1. width, height - 크기를 결정짓는 속성

* 요소로는 크기를 나타내는 숫자와 단위(px, pt, cm, %, etc)를 사용. 단위를 사용치 않으면 자동으로 px로 인식한다.

2. background - 배경을 결정짓는 속성

* 요소로는 색상을 사용할 수도 있고 이미지 주소를 사용할 수도 있다.

<div style="background:색상;">내용</div> - 배경색 사용시

<div style="background:url('이미지 주소');">내용</div> - 배경 이미지 사용시

3. border - 테두리를 결정짓는 속성

* 요소로는 테두리의 두께, 형태(8가지), 색상을 사용한다.

(주의, 용소의 3가지를 모두 적지 않아도 무방하지만 형태는 반드시 적어야 한다.)

* border의 8가지 형태는 dotted, dashed, solid, double, ridge, inset, outset 이다.

4. padding - 경계에서 내용까지의 여백을 결정짓는 속성

* 요소로는 상, 우, 하, 좌의 여백 크기(0을 포함한 양의 정수)를 지정한다.

<div style="padding:10;">내용</div> - 외곽 경계에서 상, 우, 하, 좌 모두 10px씩 여백 생성

<div style="padding:10 20;">내용</div> - 외곽 경계에서 상·하:10px, 우·좌:20px 여백 생성

- 외곽 경계에서 상:10px, 우·좌:20px, 하30px 여백 생성

- 외곽 경계에서 상:1px, 우:2px, 하:3px, 좌:4px 여백 생성

5. margin - 위치를 결정짓는 속성

* padding과 유사하나 다른 속성으로 padding은 외곽경계와 내용 사이의 여백을 결정하여 내용의 위치가 바뀌지만 margin은 박스 자체와 윈도우 사이의 여백을 결정하여 박스의 위치를 결정한다.

* 요소로는 상, 우, 하, 좌의 크기(음의 정수도 가능)를 지정한다.

<div style="margin:10;">내용</div> - 경계 외곽에 상·우·하·좌 모두 10px씩 여백 생성

<div style="margin:10 20;">내용</div> - 경계 외곽에 상·하:10px, 우·좌:20px씩 여백 생성

- 경계 외곽에 상:-10px, 우·좌:10px, 하:30px 여백 생성

- 경계 외곽에 상:1px, 우:2px, 하:3px, 좌:-4px 여백 생성

6. overflow - 내용의 크기가 클 경우 스크롤바 생성

* overflow속성을 사용하지 않는다면, 내용물의 크기에 맞게 div, span, fieldset의 크기가 늘어난다.

* 요소로는 auto, hidden, scroll이 있다.

- auto의 경우 내용물이 클 경우에 자동으로 스크롤바가 생성

- hidden의 경우 지정된 크기 이외의 부분은 보여지지 않는다.

- scroll의 경우 지정된 내용물의 크기에 상관없이 스크롤바가 생성된다.

7. font - 내용에 들어가는 글자의 style을 결정짓는 속성

* 요소로는 글씨의 형태, 글씨의 크기/ 줄간격, 클씨체가 있다.

* 개별적으로 지정할 수도 있으나 한꺼번에 지정하는 것이 간략하기 대문에 여기서는 한꺼번에 지정하는 방법을 알아보겠다.

<div style="font:bold 9pt/1.3 돋움;">내용</div> - 글씨의 형태 bold:두껍게, italic:기울임

- 글씨의 크기/줄간격 크기의 단위는 pt이며 줄 간격은 pt 단위로 사용할 수도 있고

글씨의 크기에 비례하여 2배이면 2, 1.5배이면 1.5 이렇게 배수를 사용할 수도 있다.

- 글씨체는 글꼴의 이름을 사용한다.

8. color - 글자의 색상을 결정짓는 속성이다.

* 요소로는 영문으로된 색상명이나 RGB코드를 사용한다.

[출처 : http://blog.naver.com/dohyun5?Redirect=Log&logNo=70014023876]

'프로그래밍 > Html' 카테고리의 다른 글

table display Example (0)	2009.02.11
DTD (0)	2009.02.11
색상표코드 알아보는 프로그램 (0)	2009.02.11
css !important (0)	2009.02.11
border-style (0)	2009.02.11

traycolor.exe

'프로그래밍 > Html' 카테고리의 다른 글

DTD (0)	2009.02.11
Div 와 Span (0)	2009.02.11
css !important (0)	2009.02.11
border-style (0)	2009.02.11
윈도우 크기 변화에 따른 폼 속성 크기 변경 (0)	2009.02.11

HTML의 a태그로 만들어진 링크에는, 기본적으로 항상 밑줄(Underline)이 붙습니다.

요즘에는 링크에서 밑줄을 지우는 것이 일반적입니다. 링크에서 밑줄을 삭제하려면

style="text-decoration:none"

이라는 스타일을 지정하면 됩니다. 또는 클래스를 만들어 지정해 주어도 됩니다.

그런데 text-decoration:none 을 지정해도, 아주 복잡한 웹페이지의 경우에는 링크가 없어지지 않는 경우가 있습니다. CSS 속성들이 서로 뒤엉켜 있기 때문입니다. 이때는

!important

이라는 (느낌표+important) 구문을 추가하여 강제로 지정해야 합니다. 다음 예제와 같습니다:

링크 텍스트에서, 언더라인(밑줄) 삭제 예제

파일명: example.html

<html>
<head>
<style type="text/css">

/* 링크에서 밑줄 없애기 */
a.no-uline { text-decoration:none }

/* 마우스 지나갈 때만 삭제 + 강제로 없애기 */
a.noul:hover { text-decoration:none !important }

</style>
</head>

<body>


<a href="http://www.google.co.kr/" style="text-decoration:none">Google 검색</a>

<br />


<a href="http://www.google.co.kr/" class="no-uline">Google 검색</a>

<br />


<a href="http://www.google.co.kr/" class="noul">Google 검색</a>

</body>
</html>

▶▶ HTML-CSS] 마우스 가져갔을 때에만, 밑줄(언더라인) 표시; Mouse Hover Underline

모든 밑줄 한꺼번에 없애는 법: ▶▶ A태그에서 밑줄을 없애려면? 링크 언더라인 지우려면? Link Underline Remove

☞ HTML | CSS | 자바스크립트 JavaScript

'프로그래밍 > Html' 카테고리의 다른 글

Div 와 Span (0)	2009.02.11
색상표코드 알아보는 프로그램 (0)	2009.02.11
border-style (0)	2009.02.11
윈도우 크기 변화에 따른 폼 속성 크기 변경 (0)	2009.02.11
한글 깨짐 현상 (0)	2009.02.11

border-style 은 테두리의 스타일을 지정하는 속성입니다.

선택자{border-style:속성값}

테두리에 색상값을 지정할 때는 위와 같이 border-width 두께 속성과 함께 지정해야 테두리를 확인할 수 있습니다..

네 변의 테두리 색상값을 각각 다르게 설정할 때는 아래와 같이 합니다.

선택자{border-top-style:속성값;border-right-style:속성값;border-bottom-style:속성값;border-left-style:속성값;}

형태를 지정하는 border-style 속성의 속성값

solid (내부가 채워진 선 모양)
ridge (선이 입체적으로 돌출됨)
dotted (점선 모양으로 표시)
dashed (끊어진 선 모양으로 표시)
double (선을 두줄로 표시)
inset (내부가 약간 들어간 듯하게 선을 표시)
outset (바깥으로 돌출된 듯하게 선을 표시)
groove (홈이 파진 듯하게 선을 표시)
none (나타나지 않거나 혹은 기본적인 선 모양)
hidden (모양을 숨김)

'프로그래밍 > Html' 카테고리의 다른 글

색상표코드 알아보는 프로그램 (0)	2009.02.11
css !important (0)	2009.02.11
윈도우 크기 변화에 따른 폼 속성 크기 변경 (0)	2009.02.11
한글 깨짐 현상 (0)	2009.02.11
css 사전. (1)	2009.02.11

window.onresize = function()
{
    document.reply.body.style.height = document.body.clientHeight - 350;
    document.reply.ask_body.style.height = document.body.clientHeight - 240;
}

window. = function()
{
    document.reply.body.style.height = document.body.clientHeight - 350;
}

'프로그래밍 > Html' 카테고리의 다른 글

css !important (0)	2009.02.11
border-style (0)	2009.02.11
한글 깨짐 현상 (0)	2009.02.11
css 사전. (1)	2009.02.11
textarea (0)	2009.02.11

한글깨짐 현상 방지

// 뷁 출력가능.

<meta http-equiv=\"Content-Type\" content=\"text/html; charset=ks_c_5601-1987\">

<meta http-equiv="Content-Type" content="text/html; charset=euc-kr">

'프로그래밍 > Html' 카테고리의 다른 글

border-style (0)	2009.02.11
윈도우 크기 변화에 따른 폼 속성 크기 변경 (0)	2009.02.11
css 사전. (1)	2009.02.11
textarea (0)	2009.02.11
색상표 (0)	2009.02.11

배경

테두리

분류

크기

글꼴

컨텐츠 생성

목록과 표식

여백

아웃 라인

안쪽 여백

위치

표

텍스트

'프로그래밍 > Html' 카테고리의 다른 글

윈도우 크기 변화에 따른 폼 속성 크기 변경 (0)	2009.02.11
한글 깨짐 현상 (0)	2009.02.11
textarea (0)	2009.02.11
색상표 (0)	2009.02.11
테이블 관련 (0)	2009.02.11

</TEXTAREA>

※ 보충 : <textarea></textarea>태그 사이에 글 적으면 그 글이 출력화면에 보이는건 아시죠? 위에 출력화면은 태그 사이에 넣은것이 아니라 출력화면에서 넣어본거예요..

▨ textarea의 속성값(property) 알아보기

1. cols

형식 : cols = 50

옆으로 글씨가 쓰여지는 컬럼수라고 할 수 있다.(width 를 조절하는데 사용)

2. rows

형식 : rows = 7

아래로 쓰여지는 row 수 (height 를 조절하는데 사용)

textarea 는 maxLength 가 적용 되지 않는다...

length를 제한할때는 자바스크립을 이용해서 유효성 체크를 해야 한다.

3. wrap

형식 : wrap=hard

입력시 자동으로 줄바꿈이 되면 그것을 c/r 값으로 인식함(조회시 자동으로 줄바꿈되도록 하기위함)

- OFF : WRAP 속성을 사용하지 않은 것과 같이 줄 바꿈을 하지 않고 가로 스크롤바가

생겨납니다.

ENTER키 입력을 엔터기호를 추가하지 않고 프로그램으로 보낸다.
- SOFT : 화면상으로는 줄 바꿈을 하지만 "ENTER"를 입력하지 않은 것으로 취급한다.
글 입력시 자동 줄바꿈을 하지만 엔터기호를 추가하지 않고 프로그램으로 보낸다.
- HARD : 화면상에 줄 바꿈을 하면서 "ENTER"가 입력된 것과 같은 결과가 된다.

이 HARD 속성을 사용했을 때 일반 화면의 입력 영역에 입력된 모습 그대로

출력되는 것이다.
ENTER키 입력을 엔터기호를 추가하여 프로그램으로 보낸다.
- VIRTUAL : SOFT와 유사
- PHYSICAL : 글입력시 자동 줄바꿈을 하고 엔터기호를 추가하여 프로그램으로 보낸다.

※ 그밖에 속성들은 정말 많다. 일일이 하나씩 다 나열하긴 힘들다..

왜냐구? 나도 다 몰라용~~ ㅋㅋ

▨ scrolbar 없애기

형식 : style="overflow:hidden"

overflow:hidden(스크롤 숨기기)

overflow:auto (스크롤 오토-데이타가 길면 생기고 짧으면 없어진다)

overflow:yes(항상 스크롤이 있음)

※ 보충 : 만약 가로 스크롤만 없애고 싶다면?

overflow-x:hidden; overflow-y:yes로 각각 선택할 수 있음.

'프로그래밍 > Html' 카테고리의 다른 글

윈도우 크기 변화에 따른 폼 속성 크기 변경 (0)	2009.02.11
한글 깨짐 현상 (0)	2009.02.11
css 사전. (1)	2009.02.11
색상표 (0)	2009.02.11
테이블 관련 (0)	2009.02.11

색상표는 색을 모아 명도,채도를 적어든 것이다.

#FFF7F7	#FEF8F8	#FDF9F9	#FCF9F9
#FFECEC	#FCEEEE	#FAF1F1	#F9F2F2
#FFCCCC	#F8D2D2	#F2D9D9	#EFDCDC
#FF9999	#F2A6A6	#E5B2B2	#DEB8B8
#FF6666	#EC7979	#D88C8C	#CE9595
#FF3333	#E54C4C	#CC6666	#BF7373
#FF0000	#DF2020	#BF4040	#AF5050
#E60000	#C91D1D	#AC3939	#9D4747
#CC0000	#B21919	#993333	#8C4040
#B30000	#9C1616	#862D2D	#7B3838
#990000	#861313	#722626	#682F2F
#660000	#590D0D	#4C1919	#451F1F
#4D0000	#430909	#391313	#341818
#340000	#2D0606	#270D0D	#231010
#270000	#220505	#1D0A0A	#1A0C0C

#FFFDFA	#FEFCFA	#FDFCFB	#FDFDFC
#FFF7EF	#FDF7F1	#FBF7F3	#F9F7F5
#FFEBD8	#FAEBDD	#F5EBE2	#F0EBE6
#FFD7B2	#F5D7BB	#EBD7C5	#E2D8CF
#FFCE9F	#F3CEAB	#E7CEB7	#DBCFC3
#FFBD7E	#EFBD8E	#DEBD9E	#CEBEAE
#FFA147	#E8A15E	#D1A275	#BAA28C
#FF8A19	#E28A36	#C58A52	#A88B6F
#FF7E00	#DF7E20	#BF7F40	#9F7E5F
#E87100	#CA711D	#AD733A	#917357
#CC6400	#B2641A	#986433	#7F654C
#AB5300	#955315	#80542B	#6B5540
#813E00	#713F10	#603F20	#503F30
#5B2C00	#4F2C0B	#442D17	#392D22
#3B1D00	#331C07	#2C1D0F	#251D16
#231100	#1E1104	#1A1109	#16110D

#FFFCF2	#FBFAF5	#FBFAF5	#FAF9F7
#FFF9E7	#F9F6ED	#F9F6ED	#F6F4F0
#FFF5D9	#FAF3DE	#F5F0E2	#F0EEE7
#FFEFBF	#F7EBC7	#EFE7CF	#E7E3D7
#FFE69D	#F2DFA9	#E6D9B5	#DAD4C2
#FFDC74	#EDD385	#DCCA97	#CBC2A8
#FFD047	#E8C45E	#D1B975	#BAAE8C
#FFC519	#E2B636	#C5A852	#A89A6F
#FFC000	#DFAF20	#BF9F40	#9F8F5F
#F3B600	#D4A61E	#B6973D	#98895B
#DBA300	#BF951B	#A48837	#897B52
#BA8B00	#A27F17	#8B732E	#746846
#956F00	#826512	#6F5C25	#5D5338
#705400	#624D0E	#54461C	#463F2A
#4F3B00	#45360A	#3B3114	#312C1D
#332600	#2C2206	#26200D	#201D13

#FFFEF8	#FEFDF9	#FDFDFA	#FCFCFA
#FFFDEF	#FDFBF1	#FBFAF3	#F9F8F5
#FFFCE0	#FBF9E4	#F7F5E8	#F3F2EB
#FFFAC7	#F8F4CE	#F1EED5	#EAE9DC
#FFF7A2	#F3EFAD	#E7E3B9	#DCDAC5
#FFF270	#EDE382	#DBD494	#C9C6A5
#FFED33	#E5D74C	#CCC366	#B2AD7F
#FFEA00	#DFCF20	#BFB440	#9F995F
#E6D200	#C9BA1D	#ACA239	#8F8A56
#C4B200	#AB9D18	#938A31	#7A7549
#9D8E00	#897D13	#756D27	#625E3B
#766A00	#675E0F	#58521D	#49462C
#554C00	#4A430A	#3F3A15	#353320
#3C3500	#342F07	#2D290F	#252316
#272300	#221F05	#1D1B0A	#18170E
#220013	#141203	#111006	#0E0D08

#F8FCF3	#F8FBF4	#F7F9F5	#F7F8F6
#F2F9E8	#F2F7EA	#F1F4EC	#F0F2EE
#E8F5D5	#E7F1D9	#E6EDDD	#E6E9E1
#D9EFB9	#D8E8C0	#D8E8C0	#D5DACD
#C4E693	#C2DB9D	#C0D1A8	#BEC7B2
#ABDC65	#A8CD74	#A6BE83	#A3AF91
#90D133	#8CBD47	#88A95A	#85956E
#74C600	#6FAD19	#6B9431	#677B4A
#69B319	#659C16	#61862D	#5D7043
#61A500	#5D9014	#597B29	#56673E
#549000	#517E12	#4E6C24	#4B5A36
#457700	#42680F	#40591E	#3D4A2C
#355C00	#33500B	#314517	#2F3922
#264200	#233908	#233110	#222919
#192C00	#182605	#17210B	#161B10
#0F1A00	#0E1603	#0D1306	#0D100A

#F7FAF6	#F7F9F6	#F7F9F7	#F7F8F7
#ECF5EB	#EDF3EC	#EEF2ED	#EFF1EF
#DFEEDD	#E1ECDF	#E2E9E1	#E3E7E3
#CBE4C9	#CDE0CC	#D1DDD0	#D4DAD3
#B3D7B0	#B7D2B5	#BBCDBA	#BFC8BE
#96C792	#9BC098	#A1B99F	#A7B3A6
#75B570	#7CAC78	#83A381	#8B9B8A
#52A34C	#5C9857	#658D62	#6E826C
#2D8F26	#388233	#437440	#4F674D
#087B00	#156B0F	#235C1F	#304D2E
#076900	#125C0D	#1D4E1A	#294127
#065400	#0E490A	#183F15	#20341F
#054100	#0C3908	#123010	#192818
#043100	#092B06	#0E240C	#131E12
#032200	#061D04	#0A1908	#0E150D
#021600	#041303	#061005	#080D08

#F6FCFF	#F7FCFE	#F8FBFC	#F9FAFB
#EDF9FF	#EFF8FC	#F1F7FA	#F4F7F8
#E0F4FF	#E4F3FB	#E8F2F7	#EBF0F3
#CEEEFF	#D4ECF9	#DAEAF2	#E0E8EC
#B3E5FF	#BCE1F5	#C6DFEC	#CFDBE2
#90D9FF	#9ED4F1	#ACD0E3	#B9CBD5
#65CBFF	#78C4EB	#8BBED8	#9FB8C5
#33BAFF	#4CB1E5	#66A9CC	#7FA1B2
#00A0F3	#1E95D4	#3D8CB6	#5B8398
#0092E0	#1C89C4	#3881A8	#54788C
#0080C6	#1978AD	#317194	#4A6A7B
#006CA7	#156692	#2A5F7D	#3E5968
#00588A	#115378	#224E67	#344A56
#00456C	#0D415E	#1B3D51	#283943
#00324E	#0A2F44	#132C3A	#1D2930
#002235	#06202E	#0D1E27	#141C21

#F7FAFF	#F8FAFE	#F9FAFD	#FAFBFC
#F1F6FF	#F3F7FD	#F4F6FB	#F6F7F9
#E7F0FF	#EAF1FC	#EDF1F9	#F0F2F6
#D9E7FF	#DEE8FA	#E2E9F5	#E7EAF0
#C4DAFF	#CBDBF7	#D3DEF0	#DAE0E9
#A8C9FF	#B3CCF4	#BECEE9	#C8D0DE
#85B3FF	#94B6EF	#A3BAE0	#B3BED1
#5B98FF	#6F9DEA	#84A2D6	#98A7C1
#2D7CFF	#4782E4	#6188CA	#7C8FB0
#0060FF	#2068DF	#4070BF	#5F779F
#0056E6	#1D5DC9	#3964AC	#566B8F
#0049C4	#184FAB	#315593	#495B7A
#003A9D	#133E89	#274475	#3B4962
#002C76	#0F3067	#1D3358	#2C3749
#001F53	#0A2148	#15243E	#1F2734
#001436	#07162F	#0D1D28	#141921

#FFFFFF

#FBFBFB

#F8F8F8

#F4F4F4

#EEEEEE

#E5E5E5

#DDDDDD

#D0D0D0

#C0C0C0

#ADADAD

#989898

#808080

#666666

#4B4B4B

#262626

#000000

'프로그래밍 > Html' 카테고리의 다른 글

윈도우 크기 변화에 따른 폼 속성 크기 변경 (0)	2009.02.11
한글 깨짐 현상 (0)	2009.02.11
css 사전. (1)	2009.02.11
textarea (0)	2009.02.11
테이블 관련 (0)	2009.02.11

행복한 스마일맨 ^^*

프로그래밍/Html

DTD

Archive / Markup / DocumentTypeDefinition

DTD의 종류

DTD의 선택

처음 접근하기 쉬운 DTD

마임타입(mime-type)과 DTD

DTD와 랜더링 모드

'프로그래밍 > Html' 카테고리의 다른 글

Div 와 Span

'프로그래밍 > Html' 카테고리의 다른 글

색상표코드 알아보는 프로그램

'프로그래밍 > Html' 카테고리의 다른 글

css !important

링크 텍스트에서, 언더라인(밑줄) 삭제 예제

'프로그래밍 > Html' 카테고리의 다른 글

border-style

'프로그래밍 > Html' 카테고리의 다른 글

윈도우 크기 변화에 따른 폼 속성 크기 변경

'프로그래밍 > Html' 카테고리의 다른 글

한글 깨짐 현상

'프로그래밍 > Html' 카테고리의 다른 글

css 사전.

'프로그래밍 > Html' 카테고리의 다른 글

textarea

'프로그래밍 > Html' 카테고리의 다른 글

색상표

'프로그래밍 > Html' 카테고리의 다른 글

+ Recent posts

티스토리툴바