1、瀏覽器默認的樣式各種 HTML 標簽： h1-h6,p,ul,ol,dl, 即使沒有給他們定義樣式屬性值，他們在瀏覽器中顯示時，也 會具有各種樣式屬性 (主要是字體大小和各種間距 )。這是因為瀏覽器和 CSS 給這些標簽設置了默認的 樣式屬性值，各種版本的瀏覽器和CSS可能略有差別，下面列舉的是Firefox 1.5和CSS 2.1(IE)設置的 一些常見標簽的默認樣式屬性值。HTML 樣式html, address,blockquote,bod,ydd, div,dl, dt, fieldset, form,frame, frameset,h1, h2, h3, h4,h5, h6, nof

2、rames,ol, p, ul, center,dir, hr, menu, pre display: block /*以上列表元素默認狀態下一塊狀顯示，未顯示的將以內聯元素顯示， 該列表針對 HTML4 版本，部分元素在 XHTML1 中將廢棄 */li display: list-item /* 默認以列表顯示 */head display: none /*默認不顯示 */table display: table /* 默認為表格顯示 */tr display: table-row /* 默認為表格行顯示 */thead display: table-header-group /*默認為表

3、格頭部分組顯示 */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-wei

4、ght: bolder; text-align: center /* 默認為表格標題顯示，呈現加粗居中狀態 */caption text-align: center /* 默認為表格標題顯示，呈現居中狀態 */body margin: 8px; line-height: 1.12 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, di

5、r, 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 wh

6、ite-space: pre button, textarea, input, object, select display:inline-block; big font-size: 1.17em small, sub, sup font-size: .83em sub vertical-align: sub /* 定義 sub 元素默認為下標顯示 */sup vertical-align: super /* 定義 sub 元素默認為上標顯示 */table border-spacing: 2px; thead, tbody, tfoot vertical-align: middle /* 定

7、義表頭、主體表、表腳元素默認為垂直對齊 */td, th vertical-align: inherit /* 定義單元格、列標題默認為垂直對齊默認為繼承 */s, strike, del text-decoration: line-through /* 定義這些元素默認為刪除線顯示 */hr border: 1px inset /* 定義分割線默認為 1px 寬的 3D 凹邊效果 */ol, ul, dir, menu, dd margin-left: 40px ol list-style-type: decimal ol ul, ul ol, ul ul, ol ol margin-top

8、: 0; margin-bottom: 0 u, ins text-decoration: underline br:before content: "A" /* 定義換行元素的偽對象內容樣式 */:before, :after white-space: pre-line /* 定義偽對象空格字符的默認樣式 */center text-align: center abbr, acronym font-variant: small-caps; letter-spacing: 0.1em :link, :visited text-decoration: underline :f

9、ocus outline: thin dotted invert /* Begin bidirectionality settings (do not change) */BDODIR="ltr" direction: ltr; unicode-bidi: bidi-override /* 定義 BDO 元素當其屬性為 DIR="ltr" 時的默認文本讀寫顯示順序 */BDODIR="rtl" direction: rtl; unicode-bidi: bidi-override /* 定義 BDO 元素當其屬性為 DIR="

10、;rtl" 時的默 認文本讀寫顯示順序 */*DIR="ltr" direction: ltr; unicode-bidi: embed /* 定義任何元素當其屬性為 DIR="ltr" 時的默認文本讀 寫顯示順序 */*DIR="rtl" direction: rtl; unicode-bidi: embed /* 定義任何元素當其屬性為 DIR="rtl" 時的默認文本讀 寫顯示順序 */media print /* 定義標題和列表默認的打印樣式 */h1 page-break-before: alw

11、ays h1, h2, h3, h4, h5, h6 page-break-after: avoid ul, ol, dl page-break-before: avoid 瀏覽器默認樣式1. 頁邊距IE默認為10px，通過body的margin屬性設置FF默認為8px，通過body的padding屬性設置要清除頁邊距一定要清除這兩個屬性值body margin:0;padding:0;2. 段間距IE默認為19px，通過p的margin-top屬性設置FF默認為1.12em,通過p的margin-bottom屬性設p 默認為塊狀顯示，要清除段間距，一般可以設置p margin-top:0;

12、margin-bottom:0;3. 標題樣式h1h6 默認加粗顯示： font-weight:bold; 。默認大小請參上表還有是這樣的寫的h1 font-size:xx-large;h2 font-size:x-large;h3 font-size:large;h4 font-size:medium;h5 font-size:small;h6 font-size:x-small;個大瀏覽器默認字體大小為16px,即等于medium, h1h6元素默認以塊狀顯示字體顯示為粗體，要清 除標題樣式，一般可以設置hx font-weight:normal;font-size:value;4. 列表

13、樣式IE默認為40px，通過ul、ol的margin屬性設置FF默認為40px，通過ul、ol的padding屬性設置dl無縮進，但起內部的說明元素 dd默認縮進40px，而名稱元素dt沒有縮進。 要清除列表樣式，一般可以設置ul, ol, dd list-style-type:none;/*清楚列表樣式符 */margin-left:0;/*清楚 IE 左縮進 */padding-left:0;/*清楚非 IE 左縮進 */5. 元素居中IE 默認為 text-align:center;FF 默認為 margin-left:auto;margin-right:auto;6. 超鏈接樣式a 樣

14、式默認帶有下劃線，顯示顏色為藍色，被訪問過的超鏈接變紫色，要清除鏈接樣式， 置a text-decoration:none; color:#colorname;7 鼠標樣式IE 默認為 cursor:hand;FF默認為cursor:pointer。該聲明在IE中也有效8圖片鏈接樣式IE 默認為紫色 2px 的邊框線FF 默認為藍色 2px 的邊框線 要清除圖片鏈接樣式，一般可以設置 img border:0;em相對長度單位。相對于當前對象內文本的字體尺寸。 如當前對行內文本的字體尺寸未被人為設置，則相對于瀏覽器的默認字體尺寸。ex相對長度單位。相對于字符“ x”的高度。此高度通常為字體尺寸

15、的一半。 如當前對行內文本的字體尺寸未被人為設置，則相對于瀏覽器的默認字體尺寸。px像素（Pixel）。相對長度單位。像素是相對于顯示器屏幕分辨率而言的。譬如， WONDOWS 的用戶所使用的分辨率 寸。而 MAC 的用戶所使用的分辨率一般是 72 像素/英寸。般可以設般是 96像素/英pt 點（Point）。絕對長度單位。em vs pxem指字體高，任意瀏覽器的默認字體高都是 16px。所以未經調整的瀏覽器都符合：1em=16px。那么 12px=0.75em, 10px=0.625em。 為 了簡 化 font-size 的換 算，需 要在 css 中的 body 選擇器 中 聲明 Fo

16、nt-size=62.5% 這就使 em 值變為 16px*62.5%=10px,這樣 12px=1.2em, 10px=1em,也就是說只需要 將你的原來的px數值除以10,然后換上em作為單位就行了。em 有如下特點：1. em的值并不是固定的；2. em會繼承父級元素的字體大小。長度單位優化方法：1. body 選擇器中聲明 Font-size=62.5%；2. 將你的原來的px數值除以10，然后換上em作為單位；簡單吧，如果只需要以上兩步就能解決問題的話，可能就沒人用px 了。經過以上兩步，你會發現你的網站字體大得出乎想象。因為em的值不固定，又會繼承父級元素的大小，你可能會在content這個div 里把字體大小設為1.2em,也就是12px。然后你又把選擇器p的字體大小也設為1.2em,但如果p屬于 content的子級的話，p的字體大小就不是12px，而是1.2em=1.2 * 12px=14.4px。這是因為content的字 體大小被設為1.2em，這個em值繼承其父級元素body的大小，也就是16px * 62.5% * 1.2=12px,而p 作為其子級，em則繼承content的字體高，也就是12px。所以p的1.2em就不再是12px