<!DOCTYPE>
[정의 및 용도]
DOCTYPE 선언을 HTML 문서에서 맨 위에 있어야하고, 그 다음에 바로 <html>엘리먼트가 되어야 합니다.
DOCTYPE 선언을 HTML 태그가 아니라 마크업 언어를 어떤 버전에 대한 페이지를 안으로 작성된 웹 브라우저에 지시합니다
DOCTYPE 선언 문서 타입 정의 (DTD를)를 말합니다.
DTD는, 그렇게 브라우저를 올바르게 렌더링할 수있는 마크업 언어에 대한 규칙을 지정합니다.

[사용예]
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>웹 표준 블로그 (http://blog.naver.com/cj3200)</title>
</head>
<body>
</body>
</html>
HTML 4.01 Strict (엄격한) - 이 DTD는, 모든 HTML 요소와 속성을 포함 (프레임은 허용되지 않습니다.)


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
HTML 4.01 Transitional (과도적인) - 이 DTD는, 모든 HTML 요소와 속성을 포함 (프레임은 허용되지 않습니다.)


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
HTML 4.01 Frameset (프레임셋) - 이 DTD는 HTML 4.01로 과도를 동일 수 있지만 프레임셋의 콘텐츠를 사용합니다.


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">
XHTML 1.0 Strict (엄격한) - 이 DTD는, 모든 HTML 요소와 속성을 포함, 마크업 또한 잘 작성해야 XML을 형성(프레임은 허용되지 않습니다.)


<!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는, 모든 HTML 요소와 속성을 포함, 마크업 또한 잘 작성해야 XML을 형성(프레임은 허용되지 않습니다.)


<!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는 XHTML 1.0과 과도를 동일 수 있지만 프레임셋의 콘텐츠를 사용합니다.


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
XHTML 1.1 - 이 DTD는 1.0 Strict는 XHTML과에 동일하지만 당신은 모듈을 추가할 수있습니다 (예를 들어) 동부 루비 아시아 언어 지원을 제공합니다.

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

[출처] http://blog.daum.net/piter8/93
신고

<style TYPE="text/css">
<!--
.line {filter:progid:DXImageTransform.Microsoft.Gradient(GradientType=1,<xmp> StartColorStr=#e0e0e0, EndColorStr=#ffffff); height:1;}
-->
</style>

<table width="40%" cellpadding="0" cellspacing="0" border="0">
<tr>
<td class="line">&nbsp;</td>
</tr>
</table>


[출처] http://www.webmini.net/css/142268
신고
터넷 웹 콘텐츠 접근성 지침은 장애를 가진 사람들이 접근할 수 있도록 웹 콘텐츠를 제작하는 방법에 관하여 기술하고 있다.특별히 이 문서 내에 포함된 지침들은 웹 콘텐츠 저자,웹사이트 설계자 및 웹 콘텐츠 개발자들이 접근성(Accessibility)을 준수한 웹 콘텐츠를 쉽게 만들 수 있도록 도움을 주기 위하여 기획되었다.

이 지침을 제정하는 가장 큰 목적은 웹 콘텐츠에 접근하려는 모든 사람들이 어떤 컴퓨터나 운영체제, 또는 웹 브라우저(web browser)를 사용하든지, 또는 어떠한 환경에 처해 있는지에 구애받지 않고 접근할 수 있는 웹 콘텐츠를 제작할 수 있도록 도와주는 것이다. 그렇다고 해서 이 지침이 장애인들의 접근권을 위하여 그래픽 이미지나 비디오 자료와 같이 장애인들이 접근하기 어려운 콘텐츠를 사용하지 못하도록 제한하는 것은 아니며, 이들 멀티미디어 콘텐츠들도 보다 광범위한 부류의 사람들이 용이하게 접근할 수 있도록 콘텐츠를 구성하는 방안을 제시하는데 주목적이 있다.

이 지침은 한국 정보통신접근성향상표준화포럼 산하 웹접근성분과위원회가 주축이 되어 제안하는 것으로 국제 표준화 기구인 W3C(World Wide Web Consortium)의 WAI(Web Accessibility Initiative)에서 1999년 5월 제정한 웹 콘텐츠 접근성 가이드라인(WCAG : Web Content Accessibility Guidelines 1.0)과 WCAG 2.0 초안 (2003년 6월 24일판)을 참고하였으며, 부분적으로 미국 재활법 508조를 참고하여 작성한 것이다. 특히 제정시점을 기준으로 국내의 웹 환경 및 관련 보조기술의 실태를 조사하고 그 결과를 토대로 표준(안)을 마련하였다.


인터넷 웹 콘텐츠 접근성 지침

[출처] : http://www.iabf.or.kr/   [정보통신 접근성 향상 표준화 포럼]

신고

div 태그에
overflow:scroll; 이라는 스타일을 지정해 주면, div 내용이 넘치든 아니든, 항상 스크롤바가 붙습니다. 이것이 가장 많이 쓰이고 가장 무난하더군요.

overflow:auto; 라는 스타일을 지정해 주면, 내용이 div 박스 밖으로 넘칠 때에만 스크롤바가 붙습니다. 이것도 많이 쓰이는 편이지만, 내용물의 양에 따라서, 스크롤바가 붙었다 안 붙었다 하기에 디자인에 좀 어려움이 있습니다.

overflow:hidden; 으로 하면, div 박스 밖으로 넘치는 것은 보여주지 않고 그냥 숨겨 버립니다. 스크롤바도 붙지 않습니다. 특별한 목적이 있을 때에만 쓰입니다.

white-space:nowrap;
문자열이 길면 다음줄로 자동으로 행갈이가 되는데, nowrap 은 행갈이를 하지 말고 한 줄로 길게 이어서 쓰라는 의미입니다. 프로그래밍 소스 코드 등을 표현할 때에는 행갈이를 하지 않는 것이 자연스럽습니다.

width:300px; height:150px;
div 박스의 가로 세로 크기를 지정하는 것인데, 퍼센트(%)로 지정해도 좋습니다. height 속성을 생략하면 문장의 분량에 맞게 div 박스의 세로 길이가 자동으로 정해집니다. 둘 다 생략하면 스크롤바가 만들어지지 않을 수도 있습니다.

padding:10px;
div 박스 안으로 약간의 여백을 주어 보기 좋게 하는 것입니다. 필수적인 것은 아닙니다.

background-color:gold;
div 박스의 바탕색을 지정하는 것입니다. 필수적인 것은 아닙니다.

div, 특히 스크롤바를 붙인 div 박스는, IE와 파이어폭스에서 서로 다르게 보이는 경우가 많기에 주의가 필요합니다.

[출처] http://www.cyworld.com/eunmunlee/171210

신고

'CSS/HTML' 카테고리의 다른 글

DIV 스크롤바 만들기  (0) 2010.01.28
실전 웹 표준 가이드(XHTML, CSS)  (0) 2010.01.28

XHTML과 CSS에 대해서, 한국소프트웨어진흥원(KIPA)에서 만든 실전 웹 표준 가이드 PDF파일을 참고 하시면 도움이 될 겁니다.
신고

'CSS/HTML' 카테고리의 다른 글

DIV 스크롤바 만들기  (0) 2010.01.28
실전 웹 표준 가이드(XHTML, CSS)  (0) 2010.01.28

+ Recent posts

티스토리 툴바