문서타입에 따른 CSS RESET

프리셋이라고 하기도 머하다... 매번 새로 만드니깐 ㅋㅋㅋ 

css reset이 프로젝트의 환경, 레이아웃에 따라서 다 달라지기 때문이다. 

<XHTML 사용시>

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31

@import url(http://fonts.googleapis.com/earlyaccess/nanumgothic.css); * {padding:0;margin:0;} html {width:100%;height:100%;overflow-x:hidden;} body{margin:0 auto;width:100%;font-size:12px;font-family:"Nanum Gothic", dotum,"돋움",sans-serif;color:#666;} body,div,h1,h2,h3,h4,h5,h6,ul,ol,li,dl,dt,dd,p,form,fieldset,input,table,tr,th,td{margin:0; padding:0} h1, h2, h3, h4, h5, h6 {margin:0; padding:0; font-weight:normal;} img {vertical-align:top;border:none;} caption, legend {display:none} input, select, label {vertical-align:middle;} ul, ol, dl, li {list-style:none;} fieldset {margin:0;border:none;} textarea {font-size:12px;line-height:18px;} button {border:none;padding:0;margin:0;background:none;vertical-align:middle;cursor:pointer;} a {color:#666;text-decoration:none;} a:hover, a:active, a:focus {text-decoration:underline;} table {border-collapse:collapse; border:0; border-spacing:0; empty-cells:show; width:100%;} td,th {border:0; line-height:1.2em;} .blind {position:absolute;top:-9999px;width:0;height:0;overflow:hidden;margin:0;padding:0;visibility:hidden;font-size:0;line-height:0;} .clfix:after{content:".";display:block;clear:both;visibility:hidden;height:0} /*.clfix{display: inline-block}*/ * html .clfix{height:1%} * {zoom:1;} /*skipnavigation*/ #skipnavigation {position:absolute;z-index:10000;left:0;top:0;width:100%;} #skipnavigation a {display:block;width:1px;height:1px;margin-bottom:-1px;overflow:hidden;text-align:center;color:#fff;} #skipnavigation a:focus, .accessibility a:active {width:100%;height:auto;padding:5px 0;background-color:#CE292C}

<HTML5 사용시>

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26

html{width:100%;height:100%} body{width:100%;height:100%;font-family:hdml,Doutm,Tahoma,sans-serif;-webkit-text-size-adjust:none} body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,button,textarea,p,blockquote,th,td{margin:0;padding:0} header,footer,section,article,aside,nav,hgroup,details,menu,figure,figcaption{display:block;border:0;*margin:0;*padding:0;*font-size:0}/* html5 */ table{width:100%;border-collapse:collapse;border-spacing:0} fieldset,img,iframe{border:0} img{vertical-align:top} ul,ol{list-style:none} h1,h2,h3,h4,h5,h6{font-size:100%} caption,legend{display:none} a:link,a:visited,a:active,a:hover{text-decoration:none} a:focus,input:focus,textarea:focus{outline:1px dotted #4b4b4b} /* Form */ input,textarea,select,button{font-family:hdm,Doutm,Tahoma,sans-serif;font-size:13px;color:#d0d0d0;vertical-align:top} button{overflow:visible;width:auto;margin:0;padding:0;background:none;border:none} input[type="button"],input[type="text"],input[type="image"],input[type="submit"],textarea{-webkit-appearance:none} input::-ms-clear{display:none} input{height:27px;padding:0 10px;border:1px solid #d3d7de;vertical-align:top} html>body input{line-height:2} input:hover, input:focus, input:active{border:1px solid #628eb8;color:#333} textarea{resize:none} .clearFix:after{display:block;clear:both;content:""} .blind{visibility:hidden;overflow:hidden;position:absolute;top:0;left:0;width:0;height:0;font-size:0;line-height:0}