利用text-indent属性隐藏文字
在网页设计中，由于图片更具表现力（例如网站logo），所以我们往往利用图片代替文字标题来表现某些内容，这种代替不是说要用一个<img/>标签完全替换文字，如果这样的话，就不利于搜索引擎抓取我们的网站页面，这个时候我们往往利用隐藏文字（以图换字）这个小技巧来达到目的，既能够用图片很好的表现我们的文字标题，又能够很好的照顾到搜索引擎的蜘蛛。
实现原理：
1，利用图片作为文字标题的背景；
2，把图片上面的文字隐藏起来；
具体实现方法：
1，HTML代码：
代码
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>隐藏文字</title>
<link href="css.css" rel="stylesheet" type="text/css" />
</head>
<body>
<h1 id="logo"><a href="#">博客网</a></h1>
</body>
</html>
2，CSS代码：
代码
#logo a {
background:url(http://images.cnblogs.com/adminlogo.gif) left top no-repeat;
height: 51px;
width: 133px;
text-indent:200px;
white-space:nowrap;
overflow:hidden;
display:block;
}
3，说明：
我们是通过使文字溢出但不显示（overflow:hidden）的方式来达到隐藏文字的，display:block主要是用来解决在IE6版本显示不正常问题的，
white-space: nowrap主要是让图片上的文字在一行内显示完（也就是要让文字正常溢出51px*133px这个范围），让文字溢出但不显示（overflow:hidden）生效。
