Question

input.icon 
{
    border: 0;    
    cursor: pointer;
    margin: 0;
    padding: 0;
    width: 16px;
    height: 16px;
    text-indent: -1000em;
}
input.edit {         
    background: transparent url('/edit.png') no-repeat center top; 
}

在像：

这样的元素上

<input type="submit" class="icon edit" onclick="...." />

它在firefox中渲染得很好，图像上也没有文字。在IE中，它显示了value属性的文本。

为什么？ 实际上我甚至没有设置value属性，它默认为“提交查询”。

另外，我认为我的CSS可以更具体：

input.icon {
...
}
input.icon .edit {
...
}

但这对我来说不起作用，不知道为什么，所以我也改变了第二个定义：

input.edit { .. }

为什么input.icon .edit无效？

我可以将这些样式放在div元素上吗？有什么不同？

Answer 1

你有几个问题。对于第一个。我在IE8中没有看到这个问题：

http://jsfiddle.net/rfYrq/

我没有看到IE8中的文字。

问题2：“为什么没有输入.icon .edit工作？”

input.icon .edit的含义是，类edit 中的任何元素是一个类icon的输入元素。您真正想要的是 edit和icon类的任何输入。那就是这样的：

input.icon.edit

问题3：“我可以将这些样式放在div元素上吗？”

是。如果您使用自己的CSS覆盖按钮的样式，并且显然使用onclick覆盖按钮的功能，则可以根据您的具体情况使用div或span或其他元素。

输入提交标签在IE'提交查询'中显示值属性文本

1 个答案: