7

一般来说,解决 IE6 中的布局错误的最佳方法是什么?在试图弄清楚为什么您的页面突然看起来像猴子编码时,应该寻找哪些最常见的错误或问题?

4

12 回答 12

9

第一件事

获得Internet Explorer 开发人员工具栏。这是一个救命稻草,适用于 IE6 和/或 IE7。它不能替代 Web Developer Toolbar 或 Firefox 的 Firebug,但总比没有好。

认识你的敌人

阅读 IE 的怪癖——尤其是hasLayout溢出等。还有许多 CSS 细节,你要么不做,要么找到替代品。看看有多少流行的 JavaScript工具包/框架/可以解决不同的问题

罗马不是一天建成的

您使用它的次数越多,您就会记住越多,并且不必经常查找。这方面的经验是无可替代的。不过,正如一些人指出的那样,网络上有大量资源。 位置就是一切,肯定在那里。

于 2008-09-17T14:21:42.220 回答
4

http://www.positioniseverything.net/肯定会解决您的问题。

它提供了对浏览器错误的全面而深入的描述以及解决这些错误的选项。在我看来,必须阅读,

于 2008-09-17T14:19:23.067 回答
2

开始了解 IE 如何破坏页面的一种好方法是使用 CSS ( border: 1px solid red;) 在不同元素上打开红色边框。这将立即告诉您是边距问题还是填充问题,元素的实际宽度等。

于 2008-09-17T14:20:01.023 回答
1

盒子模型通常是罪魁祸首。基本上,这意味着您尝试定位和使用不受支持的 CSS 的任何 div 都会导致此问题。

如果您使用 min-{width,height} 或 max-{width,height},您可能会发现它会发生。

这为检查与不同版本的兼容性提供了很好的参考。

http://www.aptana.com/reference/html/api/CSS.index.html

于 2008-09-17T14:19:18.637 回答
1

注意到 Marc 的帖子是 -2 =D。他只是说“求助于表格”,尽管它们很糟糕,因为在像 IE6 这样的糟糕浏览器中,一些损坏的 CSS 命令只能在表格中工作(谁知道这就是为什么......你该死的比尔盖茨!!!)。这是一个很好的参考,可以了解就 CSS 而言哪些有效,哪些无效。 http://www.quirksmode.org/css/contents.html . 这是一个很好的参考,可以检查哪些很酷的效果在各种广泛使用的浏览器中有效/无效。此外,始终为使用 IE6 浏览的用户制定一个首选计划(即使它与机械污垢一样古老),因为许多企业仍在使用旧版浏览器(包括非营利组织/第三世界国家等)所以无论如何,创建一个看起来比标准水平菜单更好的下拉菜单,但创建一个专门为 IE6 的辅助菜单,当页面接收到来自 IE6 浏览器的请求时,它成为默认菜单。

于 2010-12-30T20:44:23.470 回答
0

一个常见的问题是填充没有被添加到块元素的宽度中。所以对于布局 div,避免使用填充,而是使用其中的元素来定义填充。

于 2008-09-17T14:32:13.397 回答
0

当我需要调整 IE/Standards 浏览器之间的差异时,我会使用Rafel Lima 的浏览器选择器。它大大减少了在 HTML 中使用“hacks”来解决常见问题。

您可以针对不同的浏览器,甚至不同版本的浏览器(Hello IE 6)定位 CSS 语句。它实现起来非常简单,但需要用户打开 JavaScript(大多数都这样做)。

。事物 { ....}

.ie .thing { ....}

.ie6 .thing { ....}

于 2008-09-17T14:34:39.177 回答
0

你如何定义布局错误?IE 中最令人沮丧的布局实现(我不知道这是否应该被定义为错误)是我们需要始终在 HTML <form> 标签中指定style="display:inline"以便不会出现空行扰乱表单布局。

于 2008-09-17T14:20:45.390 回答
0

我认为这个问题的范围太大了。

验证您的代码,如果疼痛仍然存在,那么祝您好运。

与任何其他球场错误类型一样,唯一真正的解决方案是谷歌寻找解决方案,或询问知道的人,(即:在 stackoverflow 向我们提供确切的问题)。

您可以使用 IE Dev 工具栏来收集一个想法,但许多错误是随机的、莫名其妙的和深奥的。IE:断头台错误、随机项目重复错误等等,不胜枚举,你可以花几个小时在任何地方用愚蠢的变量胡闹,却一无所获。

于 2008-09-17T14:21:43.937 回答
0

我有一个简单的策略,每次都有效。

首先,我使用普遍接受的 CSS 开发网站,使其在 Safari 和 Firefox 3 中看起来不错。有关浏览器支持的详细信息,请参见w3schools.com 。

然后,我进入 IE6 和 IE7 并使用条件包含更改 CSS 。

这是免费的,可让您处理不同的浏览器(IE6 和 IE7 有不同的问题)。

您会发现大多数问题来自 IE 中不受支持的功能(例如最小宽度)、框模型中的错误(IE 向某些框添加了看不见的额外填充 (3px))或定位问题。先去找那些,因为它们通常是问题所在。

于 2008-09-17T14:27:59.927 回答
-1

我们有一个浮动 div 问题,该问题仅在特定版本的 IE6 中很明显。它已通过下载最新的服务包修复。

于 2008-09-17T14:20:13.517 回答
-3

理论上,使用与 IE6 布局错误兼容的 CSS,仅使用众所周知的解决方法(css 和 html 过滤器)并以不会破坏前向兼容性的方式为它们编写代码,测试 quirks/strict 模式。

实际上,请使用桌子。

于 2008-09-17T14:22:58.643 回答