IE6 的 CSS 帮助答案

【问题标题】：Help with CSS for IE6IE6 的 CSS 帮助
【发布时间】：2011-05-08 11:19:22
【问题描述】：

我的网站在 IE6 中看起来很糟糕，但在 Firefox 中却很好。好像会影响我用css制作的图片和框。

在 Firefox 中它看起来很棒，“圆角框”并且没有问题，但在 IE6 中它是方形的并且没有对齐！！加上我的表格也出来了，背景图片也不见了。

td.login_bar {
    border-radius:10px;
    border:solid 1px #666;
    padding:10px;
    background-color:#efefef;
    -webkit-border-radius:10px;
    -moz-border-radius:10px;
}
.join_input {
    border:solid 1px #CCC;
    padding:5px;
    width:250px;
    font-size:14px;
    color:#999;
    -webkit-border-radius:4px;
    -moz-border-radius:4px;
}
.join_input:focus {
    border:solid 1px #666;
    font-weight:bold;
    background-image:url(../imgs/edit_small_ico.png);
    background-position:left;
    background-repeat:no-repeat;
    padding-left:25px;
}

那么我需要做些什么来解决这个问题？还是直接禁止IE6？我需要为 ie6+ 格式化一个新的 .css 吗？

*更新：感谢你们，我更新了我的代码，但它看起来仍然很糟糕，只是没有那么糟糕，哈哈，所以我会继续努力谢谢大家！

【问题讨论】：

我投票赞成“禁止 IE6”。另请注意，border-radius 不再需要供应商前缀。它在所有主要浏览器中都可以正常工作，无需前缀。这并不能解决您的 IE6 问题，但对您目前不支持的 IE9 和 Opera 有帮助。
IE6 不支持边框半径。你必须使用图像黑客来做到这一点。
圆角在 IE6 中仅使用 CSS 是不可能的。
不再需要供应商前缀？我是新手，所以我会改变它，我只是在为 Firefox 设计网站时，我只能阻止 IE 用户一些如何大声笑。但我会进一步研究，我可能只需要让网站看起来很难看 :( 或者查看“你必须使用图像黑客来做这件事” - 微软杀死了我的内在设计师......
是否有一个跨浏览器“圆角框”css 我可以更改/更新到？

标签： css cross-browser internet-explorer-6 rounded-corners

【解决方案1】：

IE6 不支持border-radius 属性。如果您希望这些元素具有圆角边缘，则很可能必须为使用图像的旧浏览器设置后备。

【讨论】：

【解决方案2】：

Internet Explorer 直到版本 9 才支持 border-radius - 我可能会建议应用像 IE-CSS3 这样的行为修改脚本，尽管根据 W3Counter IE6 的使用率在 4 月份下降到 2.86%，这在我看来意味着设计师最终可以开始完全无视它。与一些 CSS3 功能一样简洁，许多功能仍然不在主支持中。另一种方法是继续使用图片作为圆角，直到浏览器赶上来。

【讨论】：

感谢您的信息和回复，我决定仔细检查并调整 css，使其在 ie6 中看起来“OK”+ 不是最好的，但如果他们有 ie6，他们可以将其视为惩罚哈哈。

【解决方案3】：

我解决了这个问题，在查看了 300 个论坛后，我发现了一个 hack，它说它适用于所有浏览器，我在 ie6 中尝试过，是的，它现在显示我的圆框！

td.login_bar {
    border-radius:10px;
    border:solid 1px #666;
    padding:10px;
    background-color:#efefef;
    -webkit-border-radius:10px;
    -moz-border-radius:10px;
}

改为：

td.login_bar {
    border-radius:10px;
    border:solid 1px #666;
    padding:10px;
    background-color:#efefef;
    -moz-border-radius:10px;
    -webkit-border-radius:10px;
    -khtml-border-radius:10px;
    behavior:url(../border-radius.htc);
}

我把那个文件放在主机上，它可以 100% 工作，唯一的问题是我的表单字段没有样式，但如果它们正常显示就可以了，它仍然看起来不错。

【讨论】：

【解决方案4】：

您正在使用非 IE 供应商前缀的 CSS 扩展，例如 -webkit-border-radius 等。它们不会在 IE6 中工作。

我建议您下载一个包含 IE6 的虚拟机，如果您不支持正确支持它，请进行一些适当的测试。它处理 CSS 的方式可能很奇怪。

如有必要，您可以使用条件语句为某些浏览器添加 CSS，但如果可能的话，最好尝试让您的 CSS 在所有内容中默认工作。

【讨论】：

【解决方案5】：

如前所述，那些 -webkit 和 -moz 和 -o 主要用于前沿浏览器。但这是我自己发现对 IE6 非常有用的东西。 http://forabeautifulweb.com/blog/about/universal_internet_explorer_6_css/

【讨论】：

感谢您的链接，我会检查一下

【解决方案6】：

即使是微软在 2010 年发生的中国 Google 黑客事件之后投票支持“只禁止 IE6”：

Microsoft 知道公开的利用代码已发布，对客户尝试使用互联网 Explorer 6 和有限的、有针对性的利用此漏洞的攻击 Internet Explorer 6. 由于报告我们对其进行了更新安全咨询 979,352 名客户提醒并提供可操作的指导和帮助保护的工具反对利用 IE 漏洞。

请不要浪费您的时间进行调整，以使您的代码适合其制造商甚至不鼓励使用的浏览器。而是尝试使您的代码与现代浏览器兼容。

来源：
Hubpages: Microsoft Recommends Upgrading IE6 & IE7 Users To Upgrade Their Browsers

另见：

【讨论】：