Mac 上的 Chrome 和 Windows 上的 Chrome 有什么区别？答案

【问题标题】：Any difference between Chrome on Mac and Chrome on Windows?Mac 上的 Chrome 和 Windows 上的 Chrome 有什么区别？
【发布时间】：2012-03-24 16:46:51
【问题描述】：

我正在学习 CSS3 和 HTML5 并尝试开发一个简单的主页。由于我家只有 Mac 界面，所以我无法检查 windows 上的任何差异。

但是有一天，我的一位熟人告诉我，浏览器之间存在像素差异，我根本不知道。然后我检查了我的页面，它似乎是错误的。

尽管它与我设置的分辨率相同，但 Mac 上的 Chrome 向我显示了几个按钮的适当位置，但 Windows 上的 Chrome 没有。

他们的立场完全不同，破坏了设计。我该如何解决这个问题？还是正常？

谢谢。

【问题讨论】：

欢迎来到网页设计。
谢谢。我听说过“跨浏览器”，但不知道即使它们是相同的浏览器也会有不同的结果！ mac和windows的区别是自然的吗？
您可以检查程序版本是否不同。但是，是的，如果您想针对不同的平台，您需要在这些平台上进行测试！然后是您的问题，“我该如何解决这个问题”，但没有向我们展示您的网站。这将是困难的。
您可能还想获得一个或三个带有您打算支持的浏览器的虚拟机并在那里检查。
感谢你们周到的 cmets。真的很有帮助。谢谢。

标签： css html google-chrome position

【解决方案1】：

开发一个在操作系统和浏览器的每种组合上都相同的网站并非易事。它亲自为我的开发时间增加了很多时间来尝试解决这些问题。

有几种工具可以帮助您完成这项任务，例如Cross Browser Testing。或者您可以通过在您的机器上安装浏览器来手动测试它。使用虚拟机在其他平台上测试您的网站也很常见。 VMware 很受欢迎。

使用跨浏览器库也可以对此有所帮助。比如jQuery，很受欢迎。这个page 列出了有关该主题的更多信息。

【讨论】：

【解决方案2】：

区别不在 Chrome 中，但在 Mac 和 Windows 中有所不同。在这里，您可以检测到userAgent 并将适当的class 添加到body 标记（使用jQuery）：

jQuery(document).ready(function(){
 if(navigator.userAgent.indexOf('Mac') > 0){
  jQuery('body').addClass('mac-os');
 } else {
  jQuery("body").addClass("pc");
 }
});

检测到userAgent后，你也可以专门为Mac和Window及其浏览器编写css。

【讨论】：

【解决方案3】：

在 2018 年，chrome 和 firefox 的行为因操作系统而异。我最近建立了一个网站，在最新的 chrome 和 firefox 版本上，一个页面在 windows 中呈现正常，而在 macOS 和 ubuntu 上，它有一个小故障。应该是内联的元素在某些状态下水平显示。

【讨论】：