跨浏览器兼容性问题

Question

我发现很多人都遇到跨浏览器兼容性问题。

我的问题是为什么浏览器会以不同的方式呈现html，css或js？

是否归因于DOM？盒子模型？

为什么有W3C等标准时会出现跨浏览器兼容性问题？

主要互联网浏览器展示HTML内容的方式有何不同？为什么Internet Explorer，Firefox（Mozilla），Opera可能会以不同的方式显示相同的内容？

在构建跨浏览器兼容的网站时，我应该记住什么？

Answer 1

有很多原因或不相容：

• 规范通常是回应为特定供应商开发适当功能而编写的，
• 规范有时可能写得不好，含糊不清或者没有预期特定的最终用例。
• 浏览器供应商偶尔会因为自己的原因而忽略规范。

其他因素：

• 很多这样的东西很难实现，请正确使用，
• 还必须实现它来处理格式错误的HTML，向后兼容性等。浏览器供应商有时会牺牲“互操作性”的“正确性”，
• 历史，政治和的个性。

Answer 2

我相信有人会更好地回答这个问题，但这是一个开始：

是的，有关CSS渲染的标准应该被遵守。问题是，一些浏览器编辑器（ cough Microsoft cough ）并不认为正确实施规范（甚至完全实现规范）是一个优先事项。甚至，当布局引擎正在努力尝试确保兼容性时，在混合各种CSS属性和单元时，可能会非常讨厌如何正确呈现事物（例如，参见ACID测试http://en.wikipedia.org/wiki/Acid3）

要拥有跨浏览器网站，您基本上必须在访问者使用的浏览器（或您支持的浏览器）中正​​确检查所有网站的网页。 Selenium（seleniumhq.org）等各种工具可以为此提供帮助。

你基本上必须决定你要做什么

• 设计最低公分母（如果是IE6，你可以做的不多）
• 使用验证CSS设计并使用黑客（例如clearfix）来纠正某些浏览器中的错误行为
• 决定不支持某些浏览器（IE6是主要候选者）
• 嗅探浏览器并相应地调整显示（不是首选的方式）

关于操纵DOM的不同，jQuery等库可以帮助隐藏实现差异。

供参考，至少在以下方面测试您的网站是个好主意：

• 基于WebKit的浏览器（Chrome，Safari）
• 基于Gecko的浏览器（Firefox）
• IE
• 戏

Answer 3

这是伟大的浏览器战争的后果。现在Netscape Communications处于废墟之中，但是反对者的优势仍然存在于浏览器的代码库中，人们仍然在开发团队中。考虑看看Crockford的lecture，他给出了一些关于主题的亮点。 （您需要保存文件而不是流式传输）

Answer 4

该标准指定HTML / CSS标记应如何呈现为显示为视觉元素。它没有指定呈现应该如何工作。许多不同的人和公司已经创建了不同的可视化标记方式。由于HTML呈现是一项极其复杂的任务，当然它们并非都集中在完全相同的解决方案上。所有渲染引擎都旨在实现相同的目标，但通常规范足够模糊以允许小的差异（只是像素级别），并且错误也是不可避免的。

再补充一点，那时候浏览器供应商更少关注标准，而更多关注快速获取市场份额，以及某些公司转向接受标准的速度非常慢（你知道自己是谁）。

最后，相当复杂的规格和更复杂的浏览器是由许多不同的人写的;你不能指望从这个过程中产生绝对的完美。完美也不是HTML的目标;它意味着是一种简单的，独立于供应商和平台的标记语言，可以在各种设备上显示信息，这一点非常好。如果您需要像素完美的结果，您需要采用旨在提供此功能的技术，例如Adobe Flash（既不是平台也不是供应商独立也不简单）。

尝试从玻璃半满的角度来看待它：成千上万的不同的人已经编写了数百万行代码，在许多不同的平台上做了很多不同的事情，有许多不同的目标和重点，但最终都渲染了HTML标记几乎相同，通常只是微小的，几乎无关的差异。每个引擎当然都有弱点，如果你碰巧同时击中它们，你的网站将以不同的方式打破每个浏览器。但这可以通过一些经验来避免。

Answer 5

Hamish所说的一切，加上他提到的另一个主要问题是浏览器如何处理不正确的HTML。例如，在IE4 / NS4的时代，元素非常有问题。如果你没有关闭标签，IE4会为你关闭它。 Netscape 4会完全无视这张桌子。

今天仍然如此，一个浏览器将以不同于另一个浏览器的方式修复错误标记。是的，应该更正标记，但浏览器会尽力渲染。