本篇内容主要讲解“CSS怎么隐藏页面文字”，感兴趣的朋友不妨来看看。本文介绍的方法操作简单快捷，实用性强。下面就让小编来带大家学习“CSS怎么隐藏页面文字”吧!
方式一：text-indent:-9999px
不多说，ext-indent负值为最常用方法，然问题有三：
1.较大的负值有性能问题，例如新浪/腾讯微博提交按钮的-9999em，大概12~16万像素的宽度，相对于100个显示器宽度，在低配Android pad上，尤其含动画效果的时候，会直接卡爆；
2.FireFox浏览器下虚框。其实问题不大，overflow:hidden可修复；
3.不能应用在IE6/IE7伪inline-block水平元素上，否则元素会被text-indent拐走。
即使有人提出：
CSS Code复制内容到剪贴板
{ text-indent: 100%; white-spacing: nowrap; overflow: hidden; }
除了性能有所缓解，后面两个问题依旧存在。
方式二：font-size:0
此方式在没有给容器设置height 或者行高的情况下，设置font-size:0,则容器将无高度
方式三：设置padding,撑开容器
CSS Code复制内容到剪贴板
<style type="text/css">
.btn{height: 22px;width: 55px;overflow: hidden;}
.btn_download{display: inline-block;width:55px;height: 22px;padding-top:22px;background:url(btn_download.gif) no-repeat;text-align:center;}
</style>
<div class="btn">
<a class="btn_download" href="#" title="下载">下载</a>
</div>
方式四：letter-spacing+first-letter
1.此方法兼容IE6+, 适用于inline-block水平元素，且适用于button元素，不过，需要是下面这种写法
CSS Code复制内容到剪贴板
<button type="button/submit">按钮</button>
而不能是这样子：
CSS Code复制内容到剪贴板
<input type="button/submit" value="按钮" />
2.此方法受text-align属性影响。
text-align:left;letter-spacing+first-letter的margin使用负值，
text-align:right;letter-spacing+first-letter的margin需要使用正值。
值的大小其实没有定值。一般，letter-spacing绝对值大于2em可以，首字符margin可以大一些，demo中是-20em.
3.多个:first-letter伪元素不要使用逗号分隔，貌似会全部失效，应分开写使用逗号分隔的时候逗号前面一定要留一个空格。否则，IE6浏览器会忽略这条声明：
CSS Code复制内容到剪贴板
.btn:first-letter,
.img:first-letter {
margin-left: -20em;
}
.btn:first-letter ,
.img:first-letter {
margin-left: -20em;
}
4.可放到公共样式中，单独调用
CSS Code复制内容到剪贴板
.notext {
text-align: left;
letter-spacing: -3em;
overflow: hidden;
}
.notext:first-letter {
margin-left: -20em;
}
到此，相信大家对“CSS怎么隐藏页面文字”有了更深的了解，不妨来实际操作一番吧！这里是编程网网站，更多相关内容可以进入相关频道进行查询，关注我们，继续学习！
