5

http://jsfiddle.net/corinem/TtPgy/

我在用着：

<a href="">Lorem ipsum dolor.</a>

CSS：

a{text-indent:-9999px;}

...但这不起作用。例如，当我使用另一个标签执行此操作时<p>，它可以工作。

我也尝试添加overflow:hiddencss，但它仍然不起作用。我认为我对这个 css 属性有一个概念错误。

4

4 回答 4

17

正如其他答案所暗示的，您只能应用于text-indent: -9999px块元素。您可以使用display: inline-block或display: block;，它会工作。

我也建议使用

text-indent: 100%;
white-space: nowrap;
overflow: hidden;

而不是text-indent: -9999px;因为 -9999px 会强制浏览器在屏幕外创建一个 9999px 的框。在此处了解有关此“黑客”的更多信息：http ://www.zeldman.com/2012/03/01/replacing-the-9999px-hack-new-image-replacement/

于 2013-11-14T21:54:35.253 回答
2

tag 是 block 但 a 是 inline ，你必须写 a{text-indent:-9999px;display:inline-block;}

于 2013-11-14T21:43:53.380 回答
1 
p{
color: red;
font-family: tahoma;
font-size: 12px;
line-height: 18px;
}

p+p{
font-family: tahoma;
text-indent: 20px;
color: red; 
font-size: 12px;
line-height: 18px;
}
于 2014-09-23T21:17:01.133 回答
1

您只能对块项目执行此操作。

利用：

p,a{
    text-indent: -9999px;
    display:block
}

或者您可以将您的a标签包装在一个块项目中并设置样式。

于 2013-11-14T21:43:29.550 回答