寻找一种干净的方法来处理多个内联块元素的 IE7 兼容性答案

【问题标题】：Looking for a clean way to handle IE7 Compatibilty for multiple inline-block elements寻找一种干净的方法来处理多个内联块元素的 IE7 兼容性
【发布时间】：2013-07-16 03:11:21
【问题描述】：

我在网页中多次出现 inline-block 元素。我厌倦了应用

*display: inline;
zoom: 1;

破解所有使用这些块的 css 选择器。有没有一种方便的方法来修复页面上所有出现的问题？

【问题讨论】：

在您的文本编辑器中搜索和替换？ :)
在 mixins 中使用 LESS。
示例代码，你的意思是*{display: inline;zoom: 1;}
您有多需要 IE7 支持？ theie7countdown.com
@RyanB - 不，他的意思是他所说的；他使用'star' hack 为IE7 提供CSS 值。对于必须使用 IE6/7 的任何人来说，这是一个众所周知的 hack。有点遗憾，这是必要的，但旧 IE 版本就是这样。

标签： html css internet-explorer internet-explorer-7

【解决方案1】：

很遗憾，我对您的问题的回答是“不，没有更好的解决方案。”如果您需要支持 IE7，这些是您必须做出的妥协。

您可能有一些方法可以重构样式表以使其不那么明显——将其隐藏在一个单独的文件中，或者将它们放在自己的类中或类似的东西中——但你最终可能会做出妥协它;它可能会让事情看起来更整洁，但它可能会增加维护工作而不是让事情变得更容易。

真正摆脱必须拥有该源代码的唯一方法是在发布文件时使用某种预处理器将它们添加到样式表中。如果您需要支持 IE7，就离不开它。但这并没有真正摆脱它，而且它在您的部署过程中增加了一个额外的步骤，所以它并不是很理想。

我想另一种选择是做其他人都做过的事情并放弃对 IE7 的支持。这可能是最明智的选择。我已经好几年不支持 IE7 了，我不知道还有谁支持过。像这样的东西就是原因。哦，事实上已经没有人真正使用 IE7 了。

【讨论】：

【解决方案2】：

您可以尝试使用条件样式 hack。

创建一个单独的 css 文件，其中包含您的 IE6/7 hack，并带有 !important。然后在链接常规 css 后将此文件包含在您的页面中。

<!-- IE7-specific fixes -->
<!--[if lte IE 8]>
<style type="text/css"> @import url("./IE7Fix.css"); </style>
<![endif]-->

这样您就不必接触主 css，并且您只需根据 id-selector 或 class-selector 指定一次样式。一旦您确定不再需要支持 IE7，您就可以删除此包含。

【讨论】：

【解决方案3】：

你可以有一个大的选择器同时适用于所有的选择器，例如

/* Inline-block fix for older versions of IE */
.foo,
.bar,
.baz,
.gallery > li {
    *display: inline;
    zoom:1;
}

【讨论】：

我做了这个，因为它似乎是将修复与其他 CSS 部分分开并保持其余部分干净的好方法。