CSS隱藏文字的方法

　　h1標籤對提高SEO關鍵詞排名的作用想必是個站長都知道，但是h1標籤會使文字變大，有時候會在網頁中顯得格格不入。下面小編來跟大家分享下CSS隱藏文字的方法。

　　下面就拿網路教學基地logo部分用CSS隱藏文字來給大家舉例：

　　我們從h1代碼部分看到的其實只是文字描述，但是為了整體美觀考慮，我們把h1標籤裡面的a連結文字用CSS隱藏，並且設定背景圖片logo，這樣外觀看到的就是logo圖片

　　CSS隱藏文字代碼：

　　h1 a {

　　height: 80px;

　　width: 280px;

　　float: left;

　　text-indent: -9999px;

　　background-image: url(http://www.studynb1.com/images/logo.png);

　　background-repeat: no-repeat;

　　display: block;

　　position: relative;

　　outline: none; /* 去掉Firefox點擊時產生的虛線框 */

　　}

　　這裡我們指定了text-indent: -9999px;讓文字在最下層，然後在設定了： background-image：背景圖層logo，意思就是讓文字在圖片下面，這樣就簡簡單單實現了用CSS隱藏文字，最後設定了outline: none;，是為瞭解決去掉IE和Firefox瀏覽器點擊的時候產生的虛線框。

　　以上就是小編給各位網站SEOer們分享的css隱藏文字的方法，注意每個頁面只能用一個h1哦，不然風險很大。

 

　　本文屬網路教學基地原創，轉載請註明：http://www.studynb1.com/css/149.html