스타일시트표준화, 스타일시트초기화, reset.css

브라우져 마다 기본 설정이 조금씩 달라서 예를 들면 h1 태그의 경우 브라우져마다 다른 크기와 마진으로 출력한다. 

이럴 경우 h1{ 자기 고유의 마진과 크기 스타일 지정 ; } 이렇게 지정해서 쓰면 모든 브라우져에서 동일하게 

h1 스타일을 먹일 수 있다. 이것을 스타일 시트 표준화 또는 스타일시트 초기화 또는 요새 reset.css 라고한다.

이 reset.css 파일은 html의 맨 앞에서 로딩되어야 한다. 

작성 예시 )

body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,p,

blockquote,th,td{margin:0; padding:0; }

table { border-collapse:collapse; border-spacing:0;}

fieldset,img{ border:0; }

address , caption , cite, code, dfn, em, strong, th, var

{font-style:normal; font-weight:normal;}

ol,ul { margin:1em 0; margin-left:40px; padding-left:0;}

ul{list-style-type:disc;}

ol{list-style-type:decimal;}

caption,th{text-align:left;}

h1,h2,h3,h4,h5,h6 {font-size:100%;}

/*블록요소*/

html, div, map, dt, from { display:block;}

body { display:block; margin:8px; font-family:serif;font-size:medium;}

p , dl {display:block; margin-top:1em; margin-bottom:1em;}

dd{display:block; margin-left:40px;}

address{display:block ; font-style:italic;}

blockquote{display:block; margin:1em 40px;}

h1{ display:block; font-size:2em; font-weight:bold; margin :0.67em 0 ;}

h2{ display:block; font-size:1.5em; font-weight:bold ; margin:0.83em 0 ; }

h3{ display:block; font-size:1.125em ; font-weight:bold; margin:1em 0 ; }

h4{ display:block; font-size:1em; font-weight:bold; margin:1.33em 0;}

h5{display:block; font-size:0.75em; font-weight:bold; margin:1.67em 0;}

h6{ display:block; font-size:0.5625em; font-weight:bold ; margin:2.33em 0 ;}

pre{display;block ; font-family:monospace; white-space:pre; margin:1em 0;}

hr{display:block; height:2px; border:1px ; margin:0.5em auto 0.5em auto;}

/*테이블요소*/

table { border-spacing:2px ; border-collapse:separate; margin-top:0; margin-bottom:0; text-indent:0;}

caption{text-align:center;}

td{padding:1px;}

th{font-weight:bold; padding:1px;}

tbody, thead, tfoot { vertical-align:middle;}

/*인라인요소*/

strong { font-weight:bold;}

cite, em, var, dfn { font-style:italic;}   

code, kbd, samp { font-family: monospace;}

ins{text-decoration:line-through;}

sub{ vertical-align:-0.25em; font-size:smaller ; line-height:normal;}

sup{vertical-align: 0.5em ; font-size:smaller ; line-height:normal;}

abbr[title] , {border-bottom:dotted 1px;}

/*리스트 요소*/

ul { list-style-type:disc ; margin:1em 0; margin-left:40px;padding-left:0;}

ol { list-style-type:decimal; margin:1em 0; margin-left:40px; padding-left:0;}

/*안에 들어있는 리스트의 상단과 하단의 마진을 없애는 처리*/

ul ul ,ul ol,ul dl,ol ul , ol ol, ol dl, dl ul, dl ol, dl dl {margin-top:0 ;margin-bottom:0;}

최신 유행 reset.css 을 한번에 모아둔 곳:

http://cssreset.com/