如果我有一个明确的背景颜色设置的div和一个输入元素，背景颜色设置为’inherit’，那么它的工作原理如Chrome，Firefox和Safari，但不能在IE 8上工作， 9或10。
@H_403_2@这是一个说明问题的最小例子：jsbin example
@H_403_2@文本框应具有相同的背景颜色。当你悬停在div上时，div的背景颜色会改变，输入也应该改变。当您点击输入时，有一个覆盖继承的焦点规则。
解决方法
我可以通过使用以下CSS获得所需的效果：
div.container {
margin: 50px;
padding: 10px;
background-color: #aaa;
}
div.container input {
background-color: transparent;
border-width: 0;
}
div.container:hover {
background-color: yellow;
}
div.container input:focus {
background-color: white;
}
@H_403_2@由于某些原因，IE10中的背景颜色属性的继承似乎与其他浏览器不同。
@H_403_2@将背景颜色设置为透明而不是继承似乎可以工作。
@H_403_2@您可以在演示：http://jsfiddle.net/audetwebdesign/kTM2f/看到结果
@H_403_2@我希望我有更好的解释，但至少我们有一个工作。
@H_403_2@Bug与IE8
@H_403_2@我刚刚阅读以下相关问题：
@H_403_2@Input boxes with transparent background are not clickable in IE8
@H_403_2@在输入字段上设置background-color：transparent似乎禁用IE8中的输入字段。
@H_403_2@在这种情况下，CSS必须是更明确的版本：
div.container {
margin: 50px;
padding: 10px;
background-color: #aaa;
}
div.container input {
background-color: #aaa;
border-width: 0;
}
div.container:hover {
background-color: yellow;
}
div.container:hover input {
background-color: yellow;
}
div.container input:focus {
background-color: white;
}
