有时候页面美化要求,不得不把button上的文字一并做成图片
<input type="button' value="remove button text in ie" />
这个时候我们要采取一些办法隐藏button的value里的文字
通常我会用
text-indent: -9999px;
测过ff和chrome下都正常。但是在ie下由于样式的综合作用,button元素会随着text-indent的值移走,显示情的况有两种:
一种:整个button都不见了(display:inline-block;)
二种:button上的文字依然在(display:block;)
我们需要为ie这样写:
text-indent:-9999px; text-transform:capitalize;
这样就都兼容了。
另外一种方式
text-indent:0; line-height:0; font-size:0; overflow:hidden;
经测试可以兼容目前的所有浏览器。