且构网

分享程序员开发的那些事...
且构网 - 分享程序员编程开发的那些事

如何在所有浏览器中实现一致的布局?

更新时间:2023-02-01 23:26:24

我发现避免痛苦的***政策是遵循以下规则:


  1. 定期建立一个更符合开发人员的浏览器(如firefox),在IE(以及safari / chrome(webkit)和opera)中彻底测试。

  2. 使用严格的doctype - 你不一定需要完美的标记,但它应该是非常好的mdash; -to-use-a-css-reset-stylesheet>重置样式表。请注意,根据工作表内容,此项目可能与#2的目标不兼容。

  3. 使用JavaScript框架(如jQuery或Prototype),可以隐藏某些javascript和DOM不兼容。 li>
  4. 使用良好的语义布局 - 更容易因为行为不当的浏览器而降级。

  5. 接受它不会完美,


  6. 遵循这些规则,首先没有那么多问题。



    对于TODO引用,请参阅此问题:

    http://***.com/questions/72394/what-should-a-developer-know-before-building-a-public-web-site


    I'm near ending the repetitive alarms at my little learning project. It's still full of bugs, but as it is a weekend project I'm correcting them slowly. My problem is inconsistency of layout across browsers.

    At the moment, I'm trying to improve the "My Alarms" box after login (Just don't try to hack my website, it's still very unstable).

    Question

    What kind of tricks, hacks, tips, etc. can you give me to ensure cross-browser layout compatibility?

    I find the best policy to avoid pain is to follow these rules:

    1. Build in a more-compliant and developer-friendly browser like firefox first, test thoroughly in IE (and safari/chrome(webkit) and opera) periodically.
    2. Use a strict doctype- you don't necessarily need perfect markup, but it should be very good — good enough to avoid browser quirks modes, since quirks are by definition not standard
    3. Use a reset style sheet. Note that depending on the sheet's contents this item may be incompatible with the goal of #2.
    4. Use a javascript framework like jQuery or Prototype - they can hide some javascript and DOM incompatibilities.
    5. Use good semantic layout- it's more likely to degrade nicely for a mis-behaving browser
    6. Accept that it won't be perfect and don't sweat the really small variances

    Follow those rules and there aren't as many problems in the first place.

    For a TODO reference, see this question:
    http://***.com/questions/72394/what-should-a-developer-know-before-building-a-public-web-site