我有一个标签在我的html像这样:
<h1>My Website Title Here</h1>
使用css我想替换文字与我的实际标志。我已经得到的标志没有问题，通过调整标签和把背景图像通过css。然而，我不知道如何去掉这段文字。我以前见过，基本上就是把文字从屏幕上推开。问题是我不记得在哪里看到的。
当前回答
在元素中使用0值的字体大小和行高对我来说是有用的:
<style>
.text {
display: block;
width: 200px;
height: 200px;
font-size: 0;
line-height: 0;
}
</style>
<span class="text">
Invisible Text
</span>
其他回答
要在html中隐藏文本，使用css中的text-indent属性
.classname {
text-indent: -9999px;
white-space: nowrap;
}
/*对于动态文本，您需要添加空白，这样您应用的CSS将不会打扰。Nowrap意味着文本永远不会换行到下一行，文本将继续在同一行上，直到遇到<br>标记
使用条件标签不同的浏览器和使用css你必须放置 高度:0px，宽度:0px，你还必须放置字体大小:0px。
只需添加font-size: 0;到包含文本的元素。
.hidden {font-size: 0;｝ 字体大小:0;隐藏文本。<span class="hidden">你看不到我:)</span>
隐藏文本与可访问性:
除了其他答案之外，还有另一种有用的隐藏文本的方法。
此方法有效地隐藏了文本，但允许它对屏幕阅读器保持可见。如果需要考虑可访问性，可以考虑这个选项。
.sr-only {
position: absolute;
width: 1px;
height: 1px;
padding: 0;
margin: -1px;
overflow: hidden;
clip: rect(0,0,0,0);
border: 0;
}
值得指出的是，这个类目前在Bootstrap 3中使用。
如果你对无障碍阅读感兴趣:
无障碍网页计划(WAI) MDN易访问性文档
最好的答案适用于短文本，但如果文本换行，它只会显示在图像中。
一种方法是用jquery处理程序捕获错误。尝试加载一个图像，如果失败，它会抛出一个错误。
$('#logo img').error(function(){
$('#logo').html('<h1>My Website Title Here</h1>');
});
参见SAMPLE CODE
