如何讓CSS的標籤兼容不同的瀏覽器

在不同瀏覽器，標籤呈現的效果是有區別的。所以小面小編來談談如何讓CSS的標籤兼容不同的瀏覽器。

作爲塊級元素的標籤，在寫CSS文件時， 最好定義行高line-height， 不要定義高度height，因爲定義了高度， 就限制了塊級元素的高度， 在不同瀏覽器， 很難實現比較統一的效果，我曾經遇到，在IE6，FIREFOX(FF)效果完好， 而在IE7，標題的文字只出來一半。 且標題在不同的佈局中， 會有不同的行數要求， 比如在側欄等小地方， 標題很可能有2行或3行， 如果高度被定義了， 那麼大部分瀏覽器都會出現錯誤的顯示， 很擁擠或沒有顯示， 如果設置了底部邊線， 還可能錯位。

所以標籤， 最好不要定義高度height，但一定要定義行高line-height，其他數值，根據實際效果適當變化。這樣， 對不同瀏覽器的兼容性是最好的。

h3 {

font-size:14px;

margin: 15px 0px 10px 0px;

padding: 3px 0px 3px 0px;

line-height:20px;

color:#55295e; text-align:left;

border-bottom: 1px dotted #55295e;

}

　　標籤一般介紹

標籤是一個標題標籤，常用做網站主題、文章標題或用在段落之前，用於表明整個網站、整篇文章或段落要表達的意思。根據顯示和要表達意思的`級別可以分爲H1，H2，H3，H4，H5，H6。

標籤成對出現，以開始，以結束。

在一個WEB頁面中，H1標籤最好(理論上是應該)只出現一次，因爲它代表該WEB頁面的主題。在實際操作中，建議不要使用 h1 來定義文章標題，而是用來定義網站標題。我有一個網站， 在首頁一段文字前用了H1，併合理地分佈了H2，H3，H4，結果十天以後， 原來排在第一頁的關鍵詞， 就掉到了第四頁。因此， 用一次H2做頁面一級標題，比較安全。

H1的重要性最高，常用於表達對整個網站的作用和性質的描述，或表示網站面向的受衆羣體。其他標籤根據級別的不同分別用於顯示某個專區的名稱，或某段介紹文字的大概描述。

因它表示對網站或某段文字的大體描述，所以相對於搜索引擎來說H標籤具有很高的價值。但這並不意味着可以隨意的使用。比如，有些網站爲了刻意追求特定關鍵字的排名，而在一段文字中使用H標籤來展示關鍵字。或乾脆把H標籤當做一個容器來對網頁進行佈局。這樣完全混淆了H標籤的作用，也是不推薦的。

標籤代表了一個網頁的重點層次，但不要過度使用。否則會受到搜索引擎的不同程度的降權。

　　標籤的使用和控制，合理安排網頁層次

h1，h2，h3，是經常用到的標題標誌，權重比STONRG高一點。以前我曾在一個網頁裏多次使用H1，結果很長時間在GG的收錄都是補充頁面(更新，外連正常)。H標題作爲關鍵詞佈局的一個重要方面，一定程度上決定了網頁的層次結構和輕重佈局。很多著名的站點都使用H類標題，用法上略有區別，比較靈活。

　　1、按照內容的重要性來定義：

使用 h1 定義網站標題

使用 h2 定義文章標題

使用 h3 定義欄目標題

　　2、按照網站的層次來定義：

使用 h1 定義網站標題

使用 h2 定義欄目標題

使用 h3 定義文章標題

　　標籤CSS樣式設置

標籤默認的表現樣子一般不盡如人意， 不能滿足網頁設計的要求。好在標籤是塊級元素，適用塊級元素的屬性，標籤均可使用，因此，標籤可以通過CSS加以完美控制。

　　內外空白邊距，可以通過外邊距margin和內邊距padding控制

h1 {margin:0px;padding:0px;}

　　字體的字號，顏色，字體控制

h1 {font-size:14px; color:#55295e;font-family:Verdana,Arial, Helvetica,sans-serif; }

　　高度和寬度的控制

h1 {height:20px; width:400px;line-height:20px;}

　　行高的控制

h1 {line-height:20px;}

　　文本對齊方式的控制， 可以是left，right，center。

h1 {text-align:left;}

　　邊框的控制

h1 {border: 1px dotted #55295e;}

　　背景的控制

h1 {background: #ccc url(images/test.jpg) no-repeat top ;}