相信很多时候input上的文字困扰着web前端开发者，必须要通过修改html代码中的value值才能清空按钮上的文字，但很多人不愿意去动html代码，一方面麻烦，另外主要的原因还在于保留文字对seo有好处，对搜索引擎有力的东西当然能保留就保留。
今天零度就来告诉大家利用css去除掉input按钮上的文字的几种方法，先看一个例子：
<input type="button" style="background:red; 120px; height:50px;" value="中文" />
为了简单的演示，我把一些属性给去掉了，这是一个红色的button，上面有中文两个字，现在我要加一些css属性，把中文两个字隐藏掉。
第一个属性：text-indent
<input type="button" style="background:red; 120px; height:50px;text-indent:-9999px" value="中文" />
这个属性相信很多人都用过，很实用，是不改变html代码而让文字隐藏常用的方法，只是-9999这个数字不一定非要这么大，稍微大点，超出按钮的长度即可，当然，最好还加上overflow:hidden。
第二个属性：padding-top
<input type="button" style="background:red; 120px; height:50px;padding-top:100px" value="中文" />
padding-top的值大小可以根据情况而定，只要超过按钮的高度即可，同上，最好加上overflow属性。
第三个属性：line-height
<input type="button" style="background:red; 120px; height:50px;line-height:200px" value="中文" />
通过行高也可以使按钮上的文字隐藏，line-heigt的值要大于按钮高度的二倍，尽量设的大一点，加上overflow。
通过以上三个属性都可以很轻松的隐藏掉input按钮上的文字，从而让我们做的精美的背景图片呈现在用户面前，提高用户体验，还在等什么，赶快去试试吧，有什么问题，欢迎来咨询我。