Question

我正在设计一个带有严格doctype的html页面，并且页面中有一个表单元素。

我想要做的是在鼠标触摸我的表单时更改输入框的背景颜色。我用css做了这个：在表单标签上悬停选择器，但问题是IE只能理解悬停在“a”标签上！

我用Google搜索了我的问题，我发现的是：

使用htc文件;
使用javascript在元素上创建悬停类;
创建一个大“a”标签并将所有元素放入其中;

但我不想做任何这些解决方案！

在IE中没有更好的方法来解决这个问题吗？

我的HTML代码：

<form id="footer-search-form" title="Search" action="#action">
    <fieldset>
        <input type="text" class="footer-search-input" id="q" name="Search"></input>
        <input type="button" class="footer-search-button" title="Search" value="Search"></input>
    </fieldset>
</form>

我的CSS代码：

#footer-search-form:hover  .footer-search-button { background-color: #fff; }
#footer-search-form:hover  .footer-search-input { background-color: #fff; }

更新：经过数小时的搜索，我使用js：

完成了

onmouseover="this.setAttribute(document.all?'className':'class','footer-search-hovered');" onmouseout="this.removeAttribute(document.all?'className':'class','footer-search-hovered');"

和

.footer-search-hovered .footer-search-input, .footer-search-hovered .footer-search-button { background-color: #fff !important; } /* For IE6 compatibility */

我讨厌它，但似乎没有更好的方法......

Answer 1

你真的只会遇到麻烦if your users are using IE6。如今，大多数Web开发人员甚至都不愿意为这样的旧浏览器提供支持，所以我不担心。

Answer 2

IE已经支持:hover自IE8（甚至是IE7？我不记得了）以来已经发布超过三年的任何元素。不可否认的是，太多人仍然使用IE6（主要是因为IE没有自动更新程序 - 真的需要一个），但是对于像这种美学效果一样简单的东西，你真的不需要担心旧文物的支持。

css悬停在IE中的元素问题上

2 个答案: