CSS DIV 悬停在 Internet Explorer 8 中不起作用答案

【问题标题】：CSS DIV hover not working in Internet Explorer 8CSS DIV 悬停在 Internet Explorer 8 中不起作用
【发布时间】：2013-10-01 03:35:37
【问题描述】：

当我在 Internet Explorer 8 中悬停一个 DIV 元素时，我的 CSS 规则没有正确应用。

下面的代码没有问题：

<div id="album-view">
<div class="loading"></div>
<div id="main">
 here is my all code, this code works.
</div>
</div>

但是，在接下来的摘录中，代码不适用于 .loading 和 display:none; 属性：

<div id="album-view">
  <div class="loading" style="display:none;"></div>
  <div id="main">
   Not working
  </div>
</div>

如果有人有任何建议，请帮助指导我正确的方向。

你可以看到我的测试服务器，nasir.herobo.com/s.html#!/4或者截图http://i.stack.imgur.com/Crvmy.png

【问题讨论】：

【解决方案1】：

在 IE8 中，您的 display: none;，因为它是内联样式，不会被您的 css 覆盖。您必须使用 JavaScript 来更改内联样式，或添加 display: none;到你的 CSS 而不是元素。 IE8 及更少的浏览器与较新的浏览器具有不同的样式层次结构。

【讨论】：

【解决方案2】：

我最近遇到了 ie8 的 css :hover 问题。我的不透明度更改在悬停时无法正常工作，因为应用了 :hover 样式的 div 包含 CSS 位置属性为“相对”的子 div。就我的目的而言，“相对”不是必需的风格。将位置属性更改为静态就可以了，悬停时的不透明度更改按预期工作。

我花了几个小时的时间来研究答案，最后自己解决了。希望这个花絮可以帮助别人。

【讨论】：