html - windows xp下交叉浏览ie8

Question

所以我的噩梦成真了。我需要使这个正在开发中的网站不仅对 IE8 看起来不错，而且对 IE over Win XP 看起来也不错，显然这家公司仍然获得对 XP 的支持，并且他们的所有内部网都在 XP 下工作。

在虚拟机上进行第一次检查后，网站看起来就像 hell ，甚至布局完全被破坏，所以我决定使用 html5shiv js(修复了基本布局)，除了重置所有边距和填充和 <!--[if IE]><meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/><![endif]--> 之类的东西。 .

但一切看起来仍然很乱，特别是像在 html 上为视网膜显示问题调整图像大小(我知道，哈哈)和我用显示 block float 的东西。我已经阅读了大量有关 IE8 显示 block 情况的内容，但我无法找到一种方法来使其工作，而无需更改我所有的 float 显示 block 或创建另一个巨大的特定 ie(在 win xp..ugg 下)样式表。

为了让我的网站(平面设计没有过渡或任何花哨的东西)至少在 xp 下的 ie8 上看起来不错，你们有什么一般建议吗？任何帮助将不胜感激

Answer 1

我拥有(并使用)一台 Windows XP 机器以及更现代的机器，实际上我在 XP 机器上仍然安装了 IE6，因此作为一名网页设计师，我对为 IE 这样古怪的东西编码太熟悉了。

IE 最大且持续存在的怪癖之一是它对处理 CSS“指令”非常不宽容。遗漏一个声明 - 例如高度和宽度 - 你会得到垃圾，因为引擎决定它会尝试解释。

这些怪癖令人讨厌，但事实是，这些怪癖可以帮助您成为更严格的 CSS 编码员。

也就是说，一些有助于避免这些特殊问题的想法:

1) 声明对象的所有维度。这包括高度、宽度、边距和边距。

IE 不喜欢“自动”尺寸，除非它特别明显。

“特别明显”的一个例子是两个并排 float 的 block ，它们的百分比维度都被明确声明，当加在一起时，等于 99%(为了这个例子)，剩下 1% 明确可用用作IE可以正确计算的边距空间。

2) 并排使用 float 时，如果 float 不想礼貌地并排 float ，请尝试将此添加到 float block 元素:display: inline;

正常兼容的浏览器不会关心它，一些设计师会提示它是一个“hack”(是的，它是)，但它很短，很好，并且不需要诉诸查询就可以完成工作。

3) 确保盛放漂浮物的容器已经溢出。

关于“漂亮”与“旧版 IE 和使用 XP 的人”的一些想法:

1) 如果使用 CSS3 并使其正确呈现对您来说非常重要，那么我建议要么 a) 仅将 CSS3 用于不重要的事情，要么 b) 专门为非 CSS3 浏览器创建一个样式表。

a) 这样，如果不重要的东西没有正确加载(并且不会导致级联问题)，那就大不了了。

b) 这样，您就可以随心所欲地使用 CSS3，而不必担心它在非 CSS3 浏览器中的外观，因为您将拥有一个单独的样式表。

关于浏览器和操作系统之间图像可扩展性的思考:

1) 此网页 HERE对流体图像和可伸缩性进行了很好的讨论，它还提供了一种解决 IE 和 Windows 中图像缩放问题的方法。

您可能已经看过它，但如果您还没有看过，那就是它。