Question

某些页面在IE中显示非常糟糕，解决这些问题的最佳方法是什么？

Answer 1

您忘记添加a doctype，因此您的网页位于Quirks Mode。

将此（HTML5 doctype）添加为第一行：

<!DOCTYPE html>

它应该看起来更好。

虽然手动更改文档模式（使用开发者工具;点击F12），但它看起来仍然不正确。页面显然存在其他问题。

最相关的问题（在逃离Quirks模式之后）是：

<body style="margin: 0; padding; 0;background-color: 4DA2CA;">

Internet Explorer未显示任何背景颜色，因为您在颜色前忘记了#。（你有padding; 0，;代替:）

这将有效：

<body style="margin: 0; padding: 0; background-color: #4DA2CA">

但你不应该首先使用内联样式..

这会更好：

<body>

在样式表中使用CSS ：

body {
    margin: 0;
    padding: 0;
    background-color: #4DA2CA
}

Answer 2

你的意思是在IE中，Div是较小的。因为在IE css边框中，边距包含在声明的宽度中。所以，如果你给出了div宽度为100px，边距为10px，那么在IE中这个div的实际可见宽度将是100-10-10 = 80px。要解决问题，你可以使用子css decleration。考虑我们的示例，如果要在两个浏览器中显示此div 100px宽度，请执行以下操作

    .mydiv{       /*This deceleration will be understood by all the browsers*/
     margin:10px;
     width:120px;       
    }

    html>body .mydiv{  /*This deceleration will not be understood by IE browsers so other will override the width*/
     width:100px;          
    }

使用此功能，您可以在IE和非浏览器中统一Div的宽度

Answer 3

我强烈建议不要在每次创建新的页面元素时重新发明轮子，而不是在IE中指出每个元素的不同渲染方式的原因。

即使在现代标准投诉浏览器中，CSS也可能非常难以预测，因此最好使用来自可靠来源的防弹代码片段，例如

CSS the Missing Manual

CSS the Definitive Guide

CSS Cookbook

从HTML / CSS的工作块开始，根据自己的喜好进行修改，然后从那里测试跨浏览器。整个过程将不那么令人沮丧。

为什么页面在IE中的显示方式与谷歌浏览器不同？

3 个答案: