Question

我有以下CSS：

<style type="text/css">
#menu {
  position: fixed;
  right: 0;
  top: 50%;
  width: 8em;
  margin: -2.5em 0 0 0;
  z-index: 5;
  background: hsla(80, 90%, 40%, 0.7);
  color: white;
  font-weight: bold;
  font-size: large;
  text-align: left;
  border: solid hsla(80, 90%, 40%, 0.5);
  border-right: none;
  padding: 0.5em 0.5em 0.5em 2.5em;
  box-shadow: 0 1px 3px black;
  border-radius: 3em 0.5em 0.5em 3em;
}
#menu li { margin: 0 }
#menu a { color: inherit }

/* Make menu absolute, not fixed, on IE 5 & 6 */
#menu { position: absolute }
*>#menu { position: fixed }

p.stb { text-indent: 0; margin-top: 0.83em }
p.mtb { text-indent: 0; margin-top: 2.17em }
p.ltb { text-indent: 0; margin-top: 3.08em }
</style>

我在HTML代码中使用了以下内容：

<ul id=menu>
  <li><a href="#L384">Section 1</a>

  <li><a href="#details">Section 2</a>

  <li><a href="#FAQ">Section 3</a>
</ul>

它无法在IE 9 Quirks文档模式下工作。但是，当我更改为IE 9标准文档模式时，它可以正常工作。

如何使我的上述代码在IE 9 Quirks文档模式下工作？

Answer 1

Quirks模式是非常旧模式。它基本上是一种模拟IE5的向后兼容模式。

IE5很久以前就已经发布了，从那以后CSS已经发生了很大变化。 IE9有一个很好的渲染引擎，可以使用现代CSS代码。但当然Quirks模式试图模仿IE5，因此故意删除对所有新CSS功能的支持。

在Quirks模式下，大约有一半的CSS代码不支持它。你永远不会得到现代的CSS代码在怪癖模式下工作。

所以问题是你为什么使用怪癖模式？

对此有两种可能的答案：出于某些向后兼容的原因你需要使用怪癖模式，或者你偶然进入怪癖模式。

如果你真的需要使用怪癖模式，那么抱歉，你不能使用现代的CSS。

但是，如果你偶然进入怪癖模式，那么答案就是在html代码的顶部放置一个有效的doctype。这将告诉浏览器不要使用怪癖模式。要使用的最佳doctype是：

<!DOCTYPE html>

只需确保这是HTML页面中的第一行代码，IE将进入标准模式而不是怪癖模式。

希望有所帮助。

（ps - 你可能想阅读我最近写的关于这个主题的this blog post）

IE 9 Quirks文档模式的浮动菜单不起作用

1 个答案: