处理 CSS Shapes 和 IE Doctype
我一直在开发一个涉及 CSS Shapes 的 jQuery 插件。我遇到的问题是，如果没有声明 DOCTYPE，CSS 形状在 IE8 中不起作用。这将是我的第一个 jQuery 插件。
我的问题：jQuery 开发人员如何解决这个问题？我应该在文档中解释这个插件需要 DOCTYPE 才能工作，还是应该编写在 Quirks 模式下工作的单独 CSS？
I have been working on a jQuery plugin that involves CSS Shapes. The issue I have been coming across is that the CSS shapes do not work in IE8 if there is no DOCTYPE declared. This will be my first jQuery plugin.
My question: How do jQuery developers fix this issue? Should I just explain in the documentation that a DOCTYPE is required for this plugin to work or should I write separate CSS that works in Quirks mode?
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（2）
如今，没有人故意省略有效的文档类型 - 这会导致怪癖模式。
http://hsivonen.iki.fi/doctype/
站点没有文档类型的唯一可能的有效原因是，如果它是旧站点，则需要花费太多精力才能将其修复为在标准模式下工作。
您的插件不必在 Quirks 模式下工作。
您甚至不必在文档中提及它。预计事情将会破裂。例如，如果页面处于 Quirks 模式，则 IE9 中的新 CSS3 内容 都不起作用。
Nobody intentionally omits a valid doctype these days - that causes Quirks Mode.
http://hsivonen.iki.fi/doctype/
The only possible valid reason a site would not have a doctype is if it's a legacy site where it would take too much effort to fix it to work in Standards Mode.
Your plugin simply does not have to work in Quirks Mode.
You don't even have to mention it in your documentation. It's expected that things will break. For example, none of the new CSS3 stuff in IE9 works if the page is in Quirks Mode.
文档类型对于所有网站都应被视为强制性的。没有它会导致 IE 进入怪异模式。这是一件坏事。
这种情况已经存在很长一段时间了（自从 IE6 发布以来），所以任何仍然没有使用 Doctype 的人真的不应该被允许为了自己的安全而编写 HTML！ ;-) 因此，我认为您不必担心没有文档类型的代码的外观。
然而，我想指出的是，您正在绘制的 CSS 形状虽然确实非常聪明，但应该被视为一种 hack。有几种比这更好的方法可以在浏览器中实现任意形状。
此外，请注意，您链接的页面上的大多数形状在 IE8 或更早版本中无法使用。 （圆形和椭圆形使用CSS
border-radius，其他许多使用transform，这两者在IE8中都不支持，并且其中相当多的使用： before和:afterCSS 选择器，IE8 中有，但 IE7 没有）。即使 HTML+CSS 可以实现这些结果，它也肯定不是为这种事情而设计的。事实上，即使在 Firefox 3.6 中，我在您链接到的页面中也发现了一些渲染故障。如果您想使用代码在页面上绘制形状，那么最好使用适当的绘图库，而不是尝试破解 HTML+CSS 来实现您的突发奇想。
我会推荐一个库，例如 Raphael。该库可以使用矢量图形语言 SVG 在浏览器上绘制任意形状。它甚至可以在旧版本的 IE 中运行（在该版本中它会回退到称为 VML 的类似语言），因此您几乎拥有完整的跨浏览器支持。它还支持动画和其他效果，这对于您当前使用的 CSS 形状来说是完全不可能的。
Doctype should be considered mandatory for all websites. Not having one will cause IE to go into quirks mode. This is a bad thing.
This has been the case for a very long time now (since IE6 was released), so anyone still not using a Doctype really ought not be allowed to write HTML for their own safety! ;-) Therefore I don't think you should worry about how your code looks without a doctype.
However, I would like to point out that the CSS shapes you're drawing, while certainly very clever, should be considered a hack. There are several far better ways to achieve arbitrary shapes in the browser than this.
In addition, please note that the majority of the shapes on the page you linked won't work in IE8 or earlier. (circle and oval use CSS
border-radiusand many of the others usetransform, neither of which are supported in IE8, and quite a few of them use:beforeand:afterCSS selectors, which are in IE8, but not IE7). Even where HTML+CSS can achieve these results, it certainly wasn't designed for this kind of thing. In fact, even in Firefox 3.6, I see some rendering glitches in the page you linked to.If you want to draw shapes on your page using code, you would be better off using a proper drawing library rather than trying to hack HTML+CSS to do your whims.
I would recommend a library such as Raphael. This library can draw arbitrary shapes on the browser using the vector graphics language SVG. It even works in older versions of IE (where it falls back to a similar language called VML), so you have virtually complete cross-browser support. It also supports animations and other effects, which would be completely impossible with the CSS shapes you're currently using.