我該如何隱藏錨文本不隱藏錨

說我有以下標記：我該如何隱藏錨文本不隱藏錨

<li><a href="somehwere">Link text</a></li>

如果我有一個標籤怎麼會躲在只用CSS鏈接文本的背景圖像？字體大小：0似乎工作正常的標籤除了在ie7小斑點顯示。

由於

感謝您的幫助迄今IV用於行高：0;和font-size：0;和text-indent：-999px;但它仍然在safari中出現一些斑點，有什麼想法？

來源

2011-03-14 geoffs3310

161

嘗試

a{ 
    line-height: 0; 
    font-size: 0; 
    color: transparent; 
}

的color: transparent;涵蓋與WebKit瀏覽器仍顯示文本的1px的一個問題。

來源

2011-03-14 15:30:34 Loktar

是的工作非常感謝:-) – geoffs3310 2011-03-14 15:32:27

我發現這不工作在Chrome 15.0.874.120。還必須添加顏色：透明; – brokenindexfinger 2011-11-17 00:12:09

@brokenindexfinger怪異......但添加顏色：透明作品呢？如果可以隨意編輯我的答案並添加，或者我可以。 – Loktar 2011-11-17 00:14:42

a { text-indent:-9999px; }

傾向於從我的經驗中工作。

來源

2011-03-14 15:33:21 Mig

啊，很好，甚至沒有想到這一點，我總是用這個頭像與圖像。 – Loktar 2011-03-14 15:35:02

不利於SEO，但.. – blackhawk 2013-04-18 02:02:54

@blachawk：請解釋爲什麼它是不利於SEO – xsl 2013-07-16 10:53:58

將文本包裹在一個範圍內並設置爲visibility:hidden;隱藏可見性將隱藏該元素，但它仍佔用頁面上的相同空間（反之，display：none也將其從頁面中刪除）。

來源

2011-03-14 15:45:00 scrappedcola

謝謝scrappedcola，這是一個很好的解決方案！ – blackhawk 2013-04-18 02:08:14

這是正確的解決方案，但我使用display：none來刪除所有大小。 – 2018-01-09 17:16:48

我遵循Loktar的最佳答案，它工作得很好。我遇到的唯一問題是Chrome（我目前的版本是27.0.1453.94米）。我遇到的問題是，Chrome似乎意識到鏈接中的文本不可見，並且它將鏈接放低了一點，然後應該是這樣（類似於margin-top，但無法更改它）。這種情況發生在我們使文本隱藏的所有方式中： - line-height：0; - font-size：0; - text-indent：-9999px;

我能夠通過調整鏈路的垂直對齊這樣來解決這個問題：

vertical-align: 25px;

我希望這是有益

來源

2013-05-29 22:29:39 Simo

-5

如何display: none;

隱藏任何東西。

來源

2013-09-06 17:51:07

nope - 那隱藏了錨 – 2013-10-08 15:03:18

text-indent :-9999px

完美無瑕。

來源

2013-10-12 21:16:16 Ajey

小提示：

我有以下情形：

<a href="/page/">My link text 
:after 
</a>

我牆根與字體大小的文本：0，這樣我就可以使用FontAwesome圖標吧。這適用於Chrome 36，Firefox 31和IE9 +。

我不會推薦顏色：透明，因爲文本stil存在並且可以選擇。使用line-height：0px不允許我使用：after。也許是因爲我的元素是內聯塊。

能見度：隱藏：不允許我使用：之後。

text-indent：-9999px;：也移動了：元素後

來源

2014-07-30 07:55:57 com2ghz

是的，我也有一個僞元素的問題，這照顧了它..謝謝！ – 2016-01-05 00:34:40

另一種選擇是隱藏基於bootstraps「sr-only」類。如果您將文本換成「sr-only」類的文本，那麼文本將不會顯示，但屏幕閱讀器仍然可以訪問它。所以，你會：

<li><a href="somehwere"><span class="sr-only">Link text</span></a></li>

如果你不使用引導，依然保留以上，而且還添加以下的CSS定義的「SR-只」類：

.sr-only {position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); border: 0; }

來源

2016-05-13 18:56:45 joeshmoe301

剛需將font-size: 0;添加到包含文本的元素。這個效果很好。

來源

2017-03-01 12:14:08

-1

我能夠通過設置font-size：0來解決此問題。

來源

2017-03-30 13:10:36

我該如何隱藏錨文本不隱藏錨

回答

相關問題