html - 如何在 IE7 中定位输入值并删除文本

Question

我有input一个提交按钮的字段：

<input id="searchSubmit" type="submit" value="Search" />

我在CSS按钮上放了一个背景图像，看起来像放大镜，而不是默认按钮。

这适用于大多数浏览器，但我在使用 IE 7 和value显示在图像顶部的文本时遇到问题。

有没有一种简单的方法可以在不将其从元素value字段中删除的情况下摆脱该文本？input大意是：

#searchSubmit input[type="submit"][value=Search] {
    text-indent:-999em !important;
}

有任何想法吗？

score 2 · Accepted Answer

只需将这个简单而优雅的解决方法添加到您的 CSS 中。

不幸的是，单独的负缩进不能从 IE7 中的按钮元素中删除文本，但添加 text-transform: capitalize; 快！

#searchSubmit {
     text-indent: -9000px;
     text-transform: capitalize;
}

score 1 · Accepted Answer

将字体大小设置为零。*前缀将针对 IE7（和 IE7）。

#searchSubmit  {
    *font-size:0;
    *width:50px;
    *height:22px;
}

您需要指定宽度和高度才能使其正常工作，因为按钮的大小是基于文本的。

同样在 CSS 中，如果项目有 ID，则不需要任何辅助选择器：

#searchSubmit {...}

不是：

#searchSubmit input[type="submit"][value=Search] {...}

2 回答 2