在h1標(biāo)簽上使用css樣式,怎樣才能隱藏文字?

1）一般來說，偏移掉字體的方式是使用：text-indent:-9999px;?（注意：只能用于block，table cells和inline-block）

成都創(chuàng)新互聯(lián)公司從2013年成立，先為涿州等服務(wù)建站，涿州等地企業(yè)，進(jìn)行企業(yè)商務(wù)咨詢服務(wù)。為涿州企業(yè)網(wǎng)站制作PC+手機(jī)+微官網(wǎng)三網(wǎng)同步一站式服務(wù)解決您的所有建站問題。

text-indent:-9999px；的具體使用方法：把h1作為一個(gè)塊來顯示（display:block;），指定長(zhǎng)寬（和圖片一樣大小），然后指定h1的背景圖片，也就是將我們需要的圖片作為h1這個(gè) 標(biāo)簽的背景。而h1標(biāo)簽中插入的，仍然是作為字符形式出現(xiàn)的博客標(biāo)題，然后用text-indent:-9999px;將文字甩到屏幕看不到的地 方。（9999px應(yīng)該是足夠了，誰的屏幕也沒那么大吧）

如：

h1a href=“”博客園/a/h1

在CSS文件中：（注意：將h1轉(zhuǎn)化成block的話，他身后的的元素就被他趕到下一行了。如果正好這個(gè)h1后面，是一個(gè)按鈕，就要用float來浮動(dòng)以使他身后再出現(xiàn)簇?fù)碚撸?/p>

h1 a{height:30px;width:165px;float:left;text-indent:-9999px;background-image:url(images/logo.gif);background-repeat:no-repeat;display:block;position:relative;

}

在h1使用上語義明確，符合語義化定義。text-indent就是首行縮進(jìn)，大家都在中文段落，首行空兩格用過它。這里通過負(fù)值縮進(jìn)，使文字 超出可視區(qū)，而這時(shí)h1下的背景就顯示出來了，h1中包含的a標(biāo)簽又不影響使用，對(duì)于隱藏文字“站點(diǎn)名稱”應(yīng)該是最佳方案了。但對(duì)于多段 文字的隱藏這個(gè)方法就不適合了。

另外，點(diǎn)擊h1a鏈接時(shí)，會(huì)產(chǎn)生一個(gè)虛線框，對(duì)于IE還好，沒什么問題，虛線框只是在背影圖片大小。但是Firefox就有些麻煩，它把縮進(jìn)的文字范圍也包含進(jìn)來了，這樣不是很美觀。

于是需要屏掉點(diǎn)擊時(shí)產(chǎn)生的虛線框，IE和FF屏虛線框方法不一樣。IE采用的遍歷方法(HTC,css表達(dá)式)有些耗系統(tǒng)資源，正好我們只需要隱藏FF下的虛線框就行了，IE就不管了，說一下Firefox如何去掉鏈接的虛線框的方法。

a{outline:none;

}

outline是css3的一個(gè)屬性，用的很少。聲明，這是個(gè)不能兼容的css屬性，在ie6、ie7、遨游瀏覽器都不兼容。只有ff,ie8在加了outline:none后會(huì)取消聚焦的虛線框。

2）使用overflow:hidden;完美隱藏background之上的字體

line-height:0;

font-size:0;

overflow:hidden;

或 (不大適合用在h1標(biāo)簽上）.text-hidden {display:block;overflow:hidden;width:0;height:0;

}

3）還有另外2種方法，不推薦使用。

1、display:none;

這個(gè)大家普遍說法是，搜索引擎可能認(rèn)為被隱藏的文字屬于垃圾信息而被忽略，不為隱藏的對(duì)象保留物理占位空間。GG也搜CSS文件？不過如果用這個(gè)方法，h1如何設(shè)計(jì)，也是難題。

2、visibility:hidden;

和display:none;相對(duì)應(yīng)，為隱藏的對(duì)象保留物理占位空間。

CSS樣式怎么隱藏？

使用display:none；來隱藏所有信息（無空白位占據(jù)）推薦，CSSdisplay手冊(cè)查看

使用overflow:hidden；來隱藏溢出的文字或圖片適用推薦，CSSoverflow手冊(cè)查看

使用overflow-y:hidden；和overflow-x:hidden控制滾動(dòng)條的隱藏與否，CSSoverflow-y手冊(cè)查看，CSS手冊(cè)查看overflow-x

CSS：

CSS（層疊樣式表）是一種用來表現(xiàn)HTML或XML等文件樣式的計(jì)算機(jī)語言。CSS不僅可以靜態(tài)地修飾網(wǎng)頁，還可以配合各種腳本語言動(dòng)態(tài)地對(duì)網(wǎng)頁各元素進(jìn)行格式化。有三種方法可以在站點(diǎn)網(wǎng)頁上使用樣式表：外部樣式表、內(nèi)部樣式表和內(nèi)聯(lián)樣式。

CSS具有精簡(jiǎn)代碼，降低重構(gòu)難度、提升網(wǎng)頁訪問速度、利于SEO優(yōu)化等優(yōu)勢(shì)，能夠?qū)W(wǎng)頁中元素位置的排版進(jìn)行像素級(jí)精確控制，支持幾乎所有的字體字號(hào)樣式，擁有對(duì)網(wǎng)頁對(duì)象和模型樣式編輯的能力。

css中display怎么做顯示或隱藏

display：none可以隱藏某個(gè)元素，且隱藏的元素不會(huì)占用任何空間。該元素不但被隱藏了，而且該元素原本占用的空間也會(huì)從頁面布局中消失。

display：block可以顯示一個(gè)塊元素，或者display：inline是顯示一個(gè)內(nèi)聯(lián)元素。

display主要用的CSS樣式有以下三個(gè)：

display:block——顯示為塊級(jí)元素。

display:inline——顯示為內(nèi)聯(lián)元素。

display:inline-block——顯示為內(nèi)聯(lián)塊元素，表現(xiàn)為同行顯示并可修改寬高內(nèi)外邊距等屬性。

擴(kuò)展資料：

顯示的塊級(jí)元素(block)特性：總是獨(dú)占一行，表現(xiàn)為另起一行開始，而且其后的元素也必須另起一行顯示;寬度(width)、高度(height)、內(nèi)邊距(padding)和外邊距(margin)都可控制;

顯示的內(nèi)聯(lián)元素(inline)特性：和相鄰的內(nèi)聯(lián)元素在同一行;寬度(width)、高度(height)、內(nèi)邊距的top/bottom(padding-top/padding-bottom)和外邊距的top/bottom(margin-top/margin-bottom)都不可改變，就是里面文字或圖片的大小;

塊級(jí)元素主要有：address , blockquote , center , dir , div , dl , fieldset , form , h1 , h2 , h3 , h4 , h5 , h6 , hr , isindex , menu , noframes , noscript , ol , p , pre , table , ul , li等css屬性。

內(nèi)聯(lián)元素主要有：a , abbr , acronym , b , bdo , big , br , cite , code , dfn , em , font , i , img , input , kbd , label , q , s , samp , select , small , span , strike , strong , sub , sup ,textarea , tt , u , var等css屬性。

CSS中如何讓元素隱藏？

1、使用display:none來隱藏所有內(nèi)容

display:none可以讓網(wǎng)頁中所有內(nèi)容不顯示，如代碼、文字、鏈接、圖片、div層，是推薦的內(nèi)容隱藏方式。

div style="display:none;"我不占地兒，你看不見我；/div

2、使用visibility:hidden來隱藏內(nèi)容

visibility:hidden和display:none可以隱藏的內(nèi)容幾乎一樣，但唯一區(qū)別是它雖然隱藏了內(nèi)容，但被隱藏掉的內(nèi)容仍舊占據(jù)空間，這段隱藏了內(nèi)容卻保留空間的位置會(huì)在網(wǎng)頁中顯示為空白。

div style="visibility:hidden;"我占了地兒，你也看不見我；/div

3、使用overflow:hidden隱藏溢出內(nèi)容

overflow:hidden這種方式可以隱藏掉固定區(qū)域外的內(nèi)容，它可以有效控制顯示區(qū)域。但應(yīng)注意，使用它時(shí)需要給它定義寬度和高度，否則會(huì)無效。

div style="width:120px; height:20px; overflow:hidden;"我占的地兒太多了你就看不見我的尾巴了。。。。。/divoverflow用法中存在一個(gè)分支，overflow-x:hidden和overflow-y:hidden，x是橫向范圍，y是縱向范圍，這兩個(gè)屬性經(jīng)常用在需要隱藏滾動(dòng)條時(shí)。

分享名稱：css隱藏樣式,css隱藏方法
分享URL：http://chinadenli.net/article42/dsdsdhc.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供網(wǎng)頁設(shè)計(jì)公司、網(wǎng)站營(yíng)銷、、電子商務(wù)、軟件開發(fā)、網(wǎng)站導(dǎo)航

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請(qǐng)盡快告知，我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng)，如需處理請(qǐng)聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時(shí)需注明來源： 創(chuàng)新互聯(lián)