HTML 預設 CSS Style 設定(反 CSS Reset)


現在做網頁都很習慣使用 YUI 的 Reset CSS(詳可見: Reset CSS - 取消 Html 原有樣式), 但是遇到要某幾個 Tag 需要將樣式回復原狀的時候該怎麼辦呢~

找的結果, 果然有人把這些都寫出來(default html style sheet), 以防萬一, 做些簡單的排版並完整轉載過來. (行尾是 ","的,代表還沒結束(請自行合成一行), "}"這個才是一行的結尾).

以下轉載自: Default style sheet - HTML4標籤的樣式列表 

html, address, blockquote, body, dd, div, dl, dt, fieldset, form,
frame, frameset, h1, h2, h3, h4, h5, h6, noframes, ol, p, ul, center,
dir, hr, menu, pre { display: block }
li { display: list-item }
head { display: none }
table { display: table }
tr { display: table-row }
thead { display: table-header-group }
tbody { display: table-row-group }
tfoot { display: table-footer-group }
col { display: table-column }
colgroup  { display: table-column-group }
td, th { display: table-cell }
caption { display: table-caption }
th { font-weight: bolder; text-align: center }
caption { text-align: center }
body { margin: 8px }
h1 { font-size: 2em; margin: .67em 0 }
h2 { font-size: 1.5em; margin: .75em 0 }
h3 { font-size: 1.17em; margin: .83em 0 }
h4, p, blockquote, ul, fieldset, form, ol, dl, dir, menu { margin: 1.12em 0 }
h5 { font-size: .83em; margin: 1.5em 0 }
h6 { font-size: .75em; margin: 1.67em 0 }
h1, h2, h3, h4, h5, h6, b, strong { font-weight: bolder }
blockquote  { margin-left: 40px; margin-right: 40px }
i, cite, em, var, address { font-style: italic }
pre, tt, code, kbd, samp  { font-family: monospace }
pre { white-space: pre }
button, textarea, input, select { display: inline-block }
big { font-size: 1.17em }
small, sub, sup { font-size: .83em }
sub { vertical-align: sub }
sup { vertical-align: super }
table { border-spacing: 2px; }
thead, tbody, tfoot { vertical-align: middle }
td, th { vertical-align: inherit }
s, strike, del { text-decoration: line-through }
hr { border: 1px inset }
ol, ul, dir, menu, dd  { margin-left: 40px }
ol { list-style-type: decimal }
ol ul, ul ol, ul ul, ol ol { margin-top: 0; margin-bottom: 0 }
u, ins { text-decoration: underline }
br:before  { content: "\A" }
:before, :after { white-space: pre-line }
center { text-align: center }
:link, :visited { text-decoration: underline }
:focus { outline: thin dotted invert }

/* Begin bidirectionality settings (do not change) */
BDO[DIR="ltr"] { direction: ltr; unicode-bidi: bidi-override }
BDO[DIR="rtl"] { direction: rtl; unicode-bidi: bidi-override }

*[DIR="ltr"] { direction: ltr; unicode-bidi: embed }
*[DIR="rtl"] { direction: rtl; unicode-bidi: embed }

@media print {
 h1 { page-break-before: always }
 h1, h2, h3,  h4, h5, h6 { page-break-after: avoid }
 ul, ol, dl { page-break-before: avoid }
}

其它相關網頁


關於 Tsung

對新奇的事物都很有興趣, 喜歡簡單的東西, 過簡單的生活.
本篇發表於 My_Note-Programming。將永久鏈結加入書籤。

HTML 預設 CSS Style 設定(反 CSS Reset) 有 2 則回應

  1. Brian Hsu 說道:

    我發現有些地方還是沒有完全reset回來,如P等等
    這裡有更多的資訊 http://www.w3.org/TR/REC-CSS2/sample.html
    但有些地方如UL LI也是要自己加進去

  2. Tsung 說道:

    Cool, 這個真不錯, 大感謝 Brian 呀~ Orz..

發表迴響