简体   繁体   English

在相同CSS中对CSS hacks进行条件注释时,使用外部CSS的利弊是什么?

[英]What are pros and cons to use external css in conditional comment over css hacks in same css?

What are pros and cons 什么是利弊

if i make 4 different css? 如果我做4个不同的CSS?

  • main.css 的main.css
  • IE7.css ( in conditional comments) IE7.css(在条件注释中)
  • IE8.css ( in conditional comments) IE8.css(在条件注释中)
  • IE6.css ( in conditional comments) IE6.css(在条件注释中)

OR 要么

1 css file for all 1个CSS文件

  • main.css + including hack for IE6 + IE 7 + IE8(if needed) main.css +包括针对IE6 + IE 7 + IE8的黑客(如果需要)

The con against having different style sheets is that you'll have one more HTTP request. 反对使用不同的样式表的缺点是您将再收到一个HTTP请求。 I find that totally negligeable against the pros, though: 我发现这对职业选手是完全可以忽略的:

  • Cleaner code structure 简洁的代码结构

  • No hacks = no reliance on broken / undocumented behaviour 无骇客=不依赖残破/未记录的行为

  • Much easier to maintain for people joining the project later 对于以后加入该项目的人们而言,维护起来容易得多

  • New versions can be added easily (though hopefully, that won't be necessary for IE9 any more) 可以轻松添加新版本(尽管希望,不再需要IE9)

Pros: 优点:

  1. Performance : Saves resources for non-IE browsers. 性能 :为非IE浏览器节省资源。
  2. Validation : You can validate your CSS, and non-IE browsers does'nt have to handle non-valid CSS. 验证 :您可以验证CSS,非IE浏览器不必处理无效的CSS。
  3. Cross-browser : supports IE 5.5 to IE 8 and probably newer versions. 跨浏览器 :支持IE 5.5到IE 8以及可能的较新版本。
  4. Support : It's officially supported by Microsoft, contrary to CSS hacks. 支持 :与CSS黑客相反,它是Microsoft官方支持的。

Cons: 缺点:

  1. Maintenance : You have to maintain more files. 维护 :您必须维护更多文件。
  2. Performance : IE will have to make more HTTP requests. 性能 :IE将不得不发出更多HTTP请求。
  3. KISS : Sometimes it may be overkill, for one or two rules. :有时候,对于一两个规则来说,这可能是矫kill过正。

In general, I think conditional comments are better than CSS hacks. 总的来说,我认为条件注释比CSS hacks更好。

It's entirely dependent on how much content you have in each file and how you want to group them. 这完全取决于每个文件中包含多少内容以及如何对它们进行分组。 The separation of files is for your convenience as a maintainer, not a technical issue. 分离文件是为了方便作为维护者,而不是技术问题。

* html (to hide from IE6) is the only CSS hack you're likely to want to use today. * html (隐藏在IE6中)是您今天可能要使用的唯一CSS hack。 If you need more flexibility than that, then yes you'll want conditional comments, but no that doesn't mean you have to have separate stylesheets if you don't want to. 如果您需要的是更多灵活性,那么可以,您将需要条件注释,但这并不意味着您不必拥有单独的样式表。 And if you've only got a couple of hacks, you probably don't want to. 而且,如果您只有几个技巧,那么您可能就不想这么做。

eg. 例如。 in the markup you can add IE-specific classes 在标记中,您可以添加IE特定的类

<!--[if lt IE 7]><body class="ie6"><![endif]-->
<!--[if (gte IE 7)&(lt IE 8)]><body class="ie7"><![endif]-->
<!--[if gte IE 8]><!--><body class="ok"><!--<![endif]-->

Now you can target IE without hacks: 现在,您可以定位IE,而不会受到黑客攻击:

body.ie6 .foo { ... }
body.ie7 .foo { ... }

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM