Web Design Laboratory
HTML5-Reset-Stylesheet，簡稱 reset CSS，是一份 CSS 樣式表，它的主要目的是 重置 不同瀏覽器對於 HTML 元素的預設樣式，讓所有元素都有一個統一的起始樣式，以便開發者在設計網頁時，能夠從一個一致的基礎開始。
瀏覽器差異： 不同的瀏覽器對於同一個 HTML 元素的預設樣式可能會有差異，這會導致相同的網頁在不同瀏覽器下顯示效果不一致。
樣式衝突： 如果沒有重置預設樣式，開發者自定義的樣式可能會與瀏覽器的預設樣式發生衝突，導致樣式表現不符合預期。
開發效率： 通過重置樣式，開發者可以更快速地建立一致的樣式，提高開發效率。
CSS
CSS碼
/*
html5doctor.com Reset Stylesheet
v1.6.1
Last Updated: 2010-09-17
Author: Richard Clark - http://richclarkdesign.com
Twitter: @rich_clark
*/
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
margin:0; 移除元素的預設外邊距。
padding:0; 移除元素的預設內邊距。
border:0; 移除元素的預設邊框。
outline:0; 移除元素獲得焦點時的預設輪廓。
font-size:100%; 將字體大小設定為父元素的 100%。
vertical-align:baseline; 設定元素內容的垂直對齊方式為基線。
background:transparent; 設定元素的背景色為透明。
}
body {
line-height:1; 將 body 內容的行高設定為 1（消除行與行之間的額外間距）。
}
article,aside,details,figcaption,figure,
footer,header,hgroup,menu,nav,section {
display:block; 確保這些元素在不同瀏覽器中都表現為區塊元素，即佔據整行寬度並且另起一行。
}
nav ul {
list-style:none; 移除列表項目預設的項目符號（通常是圓點）。
}
blockquote, q {
quotes:none; 禁用瀏覽器生成的引號樣式。
}
blockquote:before, blockquote:after,
q:before, q:after {
content:'';
content:none; 將這些偽元素的內容設定為空，有效地移除任何預設引號。
}
a {
margin:0;
padding:0;
font-size:100%;
vertical-align:baseline;
background:transparent;
}
/* change colours to suit your needs */
ins {
background-color:#ff9;
color:#000;
text-decoration:none;
}
/* change colours to suit your needs */
mark {
background-color:#ff9; 將背景色設定為淺黃色 (#ff9)。
color:#000; 將文字顏色設定為黑色 (#000)。
font-style:italic;
font-weight:bold;
}
del {
text-decoration: line-through;
}
abbr[title], dfn[title] {
border-bottom:1px dotted;
cursor:help;
}
table {
border-collapse:collapse;
border-spacing:0;
}
/* change border colour to suit your needs */
hr {
display:block;
height:1px;
border:0;
border-top:1px solid #cccccc;
margin:1em 0;
padding:0;
}
input, select {
vertical-align:middle;
}