可以采取哪些步骤来避免跨浏览器兼容性问题?

1. 我通常首先对firefox(或safari)进行编码。这通常会在IE以外的浏览器中产生最好的结果。然后我点击IE8、IE7,最后点击IE6。

2. 知道什么标签会给你带来麻烦,并且不惜一切代价避免使用它们。所有这些都是关于如何熟悉每个浏览器的问题。

3. 不要使用黑客。使用IE条件注释。通过使用条件注释,可以为所有其他浏览器加载一个样式表,一个用于IE8,一个用于IE7,另一个用于IE6(如果需要这种粒度来解决问题)。它将给你一个干净的样式表尽可能少的黑客。

4. LitmusApp

5. 真的没有交叉线。如果需要兼容性,则需要兼容性。你只要把你的问题尽可能地一次解决一个,直到你有了有用的东西。

我想说从符合标准的代码开始。总是先在符合标准的浏览器中进行测试,如firefox或safari/chrome。我更喜欢Firefox作为插件(如Firebug、httpfox和Web开发栏)。然后向下(向下,我指的是Internet Explorer的所有版本)。

尽量避免对每个情况或站点进行临时修复,并尽可能通用化代码。例如,正如贾斯汀·尼斯纳在他的回答中所说,使用有条件的注释和IE6、7和8的通用样式表将消除大部分布局和格式方面的问题,而不使用(太多)黑客。您可以重用IE样式表,只需在其中放置特定于站点的代码。

使用浏览器快照、netrenderder或litmusapp之类的测试平台,这样您就可以在尽可能多的浏览器版本中看到您的站点在做什么。深入研究浏览器兼容性会让你大吃一惊,但是任何像quirksmode.org这样的伟大资源都能给你提供关于不兼容性的小缺陷的信息,所以你不会发疯,也不会秃头。

至于我什么时候穿过/画线,这是99%的Internet Explorer问题,如果它足够接近看起来像FF或Chrome/Safari,我就完成了。几乎和艺术一样,它不是你完成添加的时候,而是你完成移除你不想看到的垃圾的时候;那是你知道它完成的时候。

我说,除了坚持基本原则,你没什么能做的:

• 符合代码标准的HTML
• 及早验证,经常验证
• 对于javascript,使用类似 JQuery , Prototype 或 Dojo
• 首先选择一个你优化的“主浏览器”。

在每个项目中,都会有很多问题,但是如果你坚持这些观点,就不会太多。

我发现构建100%W3C有效代码非常有用。这并不是因为它很重要——W3C验证器抱怨的大部分内容在现实世界的浏览器中不会产生任何影响——而是因为能够运行一个验证,获得一个绿灯,并且知道所有的事情都很好,这是非常有帮助的。

要同时测试多个IE实例,可以使用 IETester . 它不是完美的——例如,有条件的注释在其中不起作用——但主要用于日常的开发工作。

使用像HTML4.1这样的doctype转换,使IE6在StandardsMode中呈现。您还可以使用重置样式表。

使用严格兼容的HTML和CSS标记,不要使用浏览器专有的CSS扩展。

IE6没有正确实现CSS,因为它完全不了解Box模型。

另一方面,IE8有一个测试套件来证明它们正确地实现了CSS 2.1的每一个方面(这是其他浏览器无法做到的)。

如上所述,为Firefox开发,并决定是否支持IE6&7。坦率地说,我不再为那些浏览器开发单独的样式表。他们没有足够的市场份额(至少在我的网站上)。

鉴于对HTML5的兴趣和对XHTML 2的兴趣不足,请严格开发HTML4.01并遵循以下实践:(在HTML4中推荐,在HTML5和XHTML 1.1中要求)

1. 所有元素和属性名称必须以小写形式出现,
2. 必须引用所有属性值,
3. 非空元素需要结束标记,
4. 不允许属性最小化,
5. 在严格模式下,所有内联元素都必须包含在块元素中。

Why to learn HTML 4.01 Strict with references.

Also see the CSS 2.1 Test Suite

所以我已经跑了一段时间了,26天后我想我已经准备好给我的发现一些反馈了。

编码:

首先,我发现 列系统 似乎减少了HTML和CSS的编写量。它们也非常适合跨浏览器。虽然有很多,但我发现 960 Grid System 最适合我: http://960.gs

接下来我发现Ruby有一个很酷的CSS扩展名, 较少 .这已被移植到.NET,可在以下位置找到: http://www.dotlesscss.com . 它很容易设置,并且在正确使用时非常强大。

Javascript可能很棘手,但我发现避免使用jquery等语言中的某些选择器和快捷方式不仅会加快应用程序的性能,而且不会表现出那么笨拙的行为。

测试浏览器:

有趣的部分来了。在没有任何软件的情况下,我发现用Internet Explorer 6和Safari测试我的应用程序实际上有助于提高我的开发速度。 firebug和firefox实际上让我围绕这些问题进行开发 这就是导致大量额外代码的原因。当针对IE6和Safari开发简单的代码时,我发现回到Firefox和IE8非常容易。我遇到的大多数问题是边界宽度,这是很容易解决的。

我发现对我来说最好的软件解决方案是Expression Web with SuperPreview,如果你想知道为什么微软会发布一系列的IE版本,那很可能是因为他们可以向你出售这些工具。

不管怎样,那是我现在的2美分。