野生动物园中的网站模糊和低分辨率，铬很好

Question

在使用 Chrome 开发后在 Safari 中测试我的网站时，我遇到了一个问题：所有文本和图像的分辨率都非常低： Site here

我在视网膜显示器上，但所有图像的显示尺寸至少是它们的两倍，并且该网站在 chrome 中运行良好：

我可能不得不从头开始重做这个网站（这次可能是认真地尝试重新学习我所知道的一切），因为我发现了它在 Firefox 中的样子。

但是下次我该如何避免呢？模糊的文字，就是这样。 是否应该包含一些 CSS 文本属性以使文本在所有平台上呈现相同？

Answer 1

PNG 图像的缩放效果肯定更好，但您也可以尝试使用 Retina.js，它为具有视网膜显示器的设备提供更高质量的图像（看起来您的主标题是一个图像，可以解释它也很模糊，但我可以' t加载它以查看）。您是否考虑过使用 Bootstrap CSS 来确保跨浏览器兼容性？

看看这些：

http://getbootstrap.com/ - 关于 Bootstrap

https://wrapbootstrap.com/themes/portfolios - 跨浏览器兼容布局的一些想法

它在 Internet Explorer 中根本不起作用，您可能还想看看 - 由于市场份额 (https://www.netmarketshare.com/browser-market-share.aspx?qprid=2&qpcustomd=0) 我试图迎合它，但使用 Bootstrap 或其他类似的包可以解决这个问题并且确保它在每个浏览器和每个设备上看起来都一样。