在CSS中，为什么要对text-indent属性设置一个很大的负值？
在CSS中，为什么要对text-indent属性设置一个很大的负值？
当我有一个像anchor这样作为标志的元素时，我会使用一个极大的负文本缩进值。
a.logo {
background: url(logo.gif) no-repeat;
text-indent: -9999px;
}
这样标志看起来就像一张图片，而且文本是不可见的。
同时，我需要将文本放在DOM中，以便搜索引擎可以找到它。
然而，
- 我不喜欢极大的负值
- 我在某些浏览器和平板电脑上看到了大滚动条的情况，当打开或关闭手风琴时
- 我听说当浏览器遇到DOM元素上的任何测量值时，根据盒模型，它会绘制一个至少具有那么大值的框。这可能会导致绘制性能问题
我还看到过人们使用透明技术、最小的字体大小、与标志背景匹配的字体颜色等。但对我来说它们看起来不够优雅。
在HTML5和CSS3之后，难道没有语义化或优雅的技术来隐藏对用户显示的文本，但仍然在DOM中存在吗？
在CSS中，有时候我们会遇到需要使用巨大的负值来设置text-indent的情况。那么为什么会出现这种情况，以及有什么解决方法呢？
首先，我们需要了解一下text-indent属性的作用。text-indent属性用于设置文本的缩进。通常情况下，我们可以使用正值来将文本向右缩进，使用负值将文本向左缩进。然而，在某些情况下，我们可能会遇到需要使用巨大的负值来设置text-indent的情况。
出现这种情况的原因可能是由于设计师的需求或者页面布局的需要。有时候，我们希望将文本隐藏起来，但又不想使用display:none来完全隐藏文本。这时，我们可以使用巨大的负值来将文本缩进到屏幕之外，从而实现文本的隐藏效果。
然而，这种方法并不是最优解决方案。使用巨大的负值来设置text-indent存在一些问题。首先，这种方法可能会导致文本在不同浏览器或设备上显示不一致。其次，这种方法可能会导致文本无法被屏幕阅读器读取，从而影响无障碍性。
为了解决这个问题，我们可以尝试其他的方法来隐藏文本。例如，我们可以使用font-size:0和line-height:0来将文本隐藏起来，而不需要使用巨大的负值来设置text-indent。另外，我们还可以使用overflow:hidden来隐藏文本溢出的部分。下面是一个示例CSS代码，演示了如何使用这些方法来隐藏文本：
.logo{
width:65px;
height:0;
background:url(logo.png) 0 0 no-repeat;
font-size:0;
line-height:0;
padding-top:15px;
overflow:hidden;
display:block;
}
通过使用这些方法，我们可以更好地隐藏文本，而不需要使用巨大的负值来设置text-indent。这样可以避免出现不一致的显示效果，并且提高了页面的无障碍性。
在CSS中，为什么要给text-indent设置一个巨大的负值？
出现的原因：
- 为了实现图像替换技术（image replacement technique），即将文本替换为图像显示，常用于制作logo或品牌的标题。
- 通过设置巨大的负值，使得文本缩进到容器的左边界之外，从而实现完全隐藏文本，只显示背景图像。
解决方法：
- 可以使用众多的图像替换技术，例如h5bp中提供的方法，将文本的字体设置为0，颜色设置为透明，背景设置为图像，从而实现文本的替换。
- 可以参考其他的图像替换技术，例如在CSS-Tricks网站上提供的示例，了解更多的图像替换方法。
- 如果要替换的是logo或品牌标题，可以将其放在
标签中，因为据说谷歌推荐这样做。可以通过谷歌搜索来获取类似的文章，例如像Hobo-web这样的网站上提供的文章。
文章整理如下：
在CSS中，为什么要给text-indent设置一个巨大的负值？
在进行图像替换技术时，有时我们会将文本替换为图像来显示，这常用于制作logo或品牌的标题。为了实现这一效果，我们可以使用h5bp等方法，将文本的字体设置为0，颜色设置为透明，背景设置为图像。这样一来，文本将完全隐藏，只显示背景图像。
另外，我们还可以参考其他的图像替换技术，例如在CSS-Tricks网站上提供的示例。这些技术可以帮助我们了解更多的图像替换方法，让我们能够选择最适合自己需求的方法。
如果要替换的是logo或品牌标题，可以将其放在
标签中。据说，谷歌推荐将logo或品牌标题放在
标签中。我们可以通过谷歌搜索来获取类似的文章，例如像Hobo-web这样的网站上提供的文章。
总结起来，通过设置巨大的负值来实现text-indent的目的是为了实现图像替换技术，将文本替换为图像显示。我们可以根据自己的需求选择不同的图像替换方法，并遵循谷歌等搜索引擎的建议来优化我们的网页。