讓超鏈接內(nèi)翰墨埋伏掉css技巧結(jié)構(gòu)辦法

無(wú)心div css網(wǎng)頁(yè)組織時(shí)，運(yùn)用超鏈接a標(biāo)簽，但重要將文字竄伏，但超鏈接又不失效的需求。比喻圖片或圖標(biāo)的超鏈接，把圖片或圖標(biāo)作為布景圖片，上面應(yīng)用超鏈接a加文字，但又不想讓文字顯示，超鏈接具有的又大要點(diǎn)擊，圖片也可以瞥見(jiàn)這個(gè)時(shí)刻即是隱藏超鏈接文字。

應(yīng)用CSS屬性單詞：text-indent

text-indent引見(jiàn)：

文本內(nèi)容縮進(jìn)屬性，思空見(jiàn)貫用于文段開(kāi)頭文字縮進(jìn)兩個(gè)筆墨，好比文章段落每段縮進(jìn)兩個(gè)漢字設(shè)置text-indent便可。

要隱藏也是有text-indent來(lái)實(shí)現(xiàn)，例如設(shè)置裝備擺設(shè)text-indent:-999px或text-indent:-9999px讓對(duì)象內(nèi)文字往前縮進(jìn)9999px抵達(dá)潛伏感導(dǎo)。

超鏈接具備文字匿伏c(diǎn)ss結(jié)構(gòu)案例如下：

1、案例代碼

超鏈接存在筆墨埋伏 在線演示 - www.CSS5.com

.logo{ margin:0 auto;width:175px; height:51px;

bac千克round:url(CSS5logo.gif) no-repeat 0 0}

.logo a{ display:block; width:100%; height:100%; text-indent:-9999px}

配置一個(gè)class=logo的盒子，配置CSS5的站點(diǎn)logo為背景圖片，配置寬度與高度。

2、案例截圖

css機(jī)關(guān)超鏈接內(nèi)翰墨隱藏，同時(shí)超鏈接也具備

3、案例分析

首先”.logo”抉擇器內(nèi)設(shè)置css寬度、css高度、logo圖片作為后臺(tái)；

再對(duì)class=logo對(duì)象內(nèi)超鏈接a配置造成塊(讓超鏈接a寬高失效)、設(shè)置寬度與高度，同時(shí)設(shè)置 text-indent:-9999px埋伏超鏈接內(nèi)的翰墨。只管何等翰墨隱藏了，但超鏈接和布景圖片留存了。