处理CSS形状和IE Doctype

Question

我一直在研究一个涉及CSS Shapes的jQuery插件。我遇到的问题是，如果没有声明DOCTYPE，CSS形状在IE8中不起作用。这将是我的第一个jQuery插件。

我的问题：jQuery开发人员如何解决这个问题？我应该在文档中解释一下这个插件需要使用DOCTYPE还是应该编写单独的CSS，以独特模式工作？

Answer 1

没有人故意这几天遗漏了有效的文档类型 - 这会导致Quirks Mode。

http://hsivonen.iki.fi/doctype/

你故意想怪癖模式 - 无文档类型。

请不要这样做。如果没有人更关心Windows IE 6了（已经没有 人们关心Netscape 4.x和IE 5），那么会为你，你的同事或未来的 未来的继任者带来困扰。设计怪癖模式 是一个坏主意。相信我。

网站没有文档类型的唯一可能的有效原因是，如果它是一个遗留网站，它将需要太多的努力来解决它在标准模式下工作。

你的插件根本不需要在怪癖模式下工作。

您甚至不必在文档中提及它。预计事情将会破裂。例如，如果页面处于怪癖模式，则new CSS3 stuff in IE9都不起作用。

Answer 2

对于所有网站，Doctype应视为强制性的。没有人会导致IE进入怪癖模式。这是一件坏事。

现在这种情况已经很长时间了（自IE6发布以来），所以任何仍未使用Doctype的人都不应该被允许为了自己的安全而编写HTML！ ;-)因此，我不认为你应该担心你的代码看起来没有文档类型。

但是，我想指出你绘制的CSS形状，当然非常聪明，应该被认为是黑客。在浏览器中实现任意形状有几种比这更好的方法。

此外，请注意，您链接的页面上的大部分形状在IE8或更早版本中将不起作用。 （圆形和椭圆形使用CSS border-radius，其他许多使用transform，IE8不支持其中的任何一种，其中很多都使用:before和:after CSS选择器，它们在IE8中，但不在IE7中）。即使在HTML + CSS可以实现这些结果的地方，它当然也不是为这种事情设计的。事实上，即使在Firefox 3.6中，我在您链接的页面中看到一些渲染故障。

如果要使用代码在页面上绘制图形，最好使用适当的绘图库，而不是试图破解HTML + CSS来完成您的想法。

我会推荐一个库，如Raphael。该库可以使用矢量图形语言SVG在浏览器上绘制任意形状。它甚至可以在旧版本的IE中使用（在这个版本中，它可以回溯到类似的语言VML），所以你几乎可以完成跨浏览器的支持。它还支持动画和其他效果，这对于当前使用的CSS形状来说是完全不可能的。