Question

更新：[请参阅本问题底部关于保罗爱尔兰技术的第三种技巧！]

我想知道网络开发人员对这两种方法的看法？哪个最好？对两者的考虑？

方法1：

所有样式的单个CSS文件，在包装器div中使用条件注释将特定ID应用于HTML。

CSS

  /*** For IE 7 and up ***/

#ie7andup #anyelement {
    border-color : blue;
}

HTML

<!--[if gte IE 7]>
<div id="ie7andup">
<![endif]-->

    <!--[if IE 6]>
    <div id="ie6only">
    <![endif]-->

        <!--[if IE 5.5000]>
        <div id="ie5-5only">
        <![endif]-->

            <!--[if lt IE 5.5000]>
            <div id="ie5-01only">
            <![endif]-->

<div id="anyelement">a box with some content</div>

[... more page content ...]


    <!--[if IE]>
    </div>
    <![endif]-->

（通过http://www.positioniseverything.net/articles/cc-plus.html）

方法2：

单独的IE样式表，包含条件注释，包括那些CSS文件。

<link href="main.css" rel="stylesheet" type="text/css">
<!--[if IE 7]>
<link href="ie7.css" rel="stylesheet" type="text/css">
<![endif]-->
<!--[if IE 6]>
<link href="ie6.css" rel="stylesheet" type="text/css">
<![endif]-->
<!--[if IE 5]>
<link href="ie5.css" rel="stylesheet" type="text/css">
<![endif]-->

（通过http://reference.sitepoint.com/css/conditionalcomments）

用于定位所有IE并修复其问题。第一种方法不会更清洁你的CSS，并简化它吗？或者为IE提供单独的CSS文件是否有意义？

我希望看到一些链接到其他参考/文章，保护一种方法而不是另一种方法。我看到大多数人使用后者。

更新 - 查看Paul Irish的这项技巧！：

这可能会更好。这样怎么样？使用Modernizer，你可以让你的一个样式表中有IE的特定部分 -

http://paulirish.com/2008/conditional-stylesheets-vs-css-hacks-answer-neither/

对此的想法？

Answer 1

我更喜欢方法2.身体中的任何样式信息对我来说似乎都不太可维护，因为你必须在任何时候想要进行更改时搜索它，并且还必须逐页更改。

Answer 2

方法二还可以减少不必要的流量。互联网浏览器不共享他们的缓存，因此IE7下载IE6他的styleinfo将毫无用处。关于你关于'干净CSS'的评论，当按照UI，对话框，IE等“主题”分割样式表时，大型应用程序通常更容易维护。另外，由于流水线操作，下载多个中等大小的文件比大文件更快它存在于所有现代浏览器中。

使用条件注释和一个样式表来定位IE

2 个答案: