Question

我想知道哪种方式最适合速度：

选项1：为每个浏览器加载单独的CSS（通过<script/>包含单独的JS文件）：

// for internet explorer 6 & 7
if ($.browser.msie) {
    document.write('<link rel="stylesheet" type="text/css" href="/css/styles-ie.css" />');
}

// for opera
if ($.browser.opera) {
    document.write('<link rel="stylesheet" type="text/css" href="/css/styles-opera.css" />');
}

选项2：内联CSS（通过<script/>包含的单独JS文件）：

// for internet explorer 6 & 7
if ($.browser.msie) {
    document.write('[some CSS styles]');
}

// for opera
if ($.browser.opera) {
    document.write('[some CSS styles]');
}

选项3：还是有另一种更好的方法吗？

Answer 1

我最喜欢conditional comments，虽然我没有真正测试它，但我认为它也是最快的选择，因为不涉及DOM操作。还有一个great article关于支持IE与此技术的讨论，但阅读一些pitfalls上的文章可能会有所帮助。

根据我的经验，没有必要为IE以外的其他浏览器做任何例外，但是因为你的例子也列出了Opera，我建议你使用一些CSS hacks来进行Opera所需的（可能很小的）更改。如果您对Opera Specific CSS进行网络搜索，您可能会找到您喜欢的内容;）

Answer 2

我使用CSS Reset来平衡比赛场地。这通常会使所有浏览器的行为与我应用的样式相当可预测。当然，我遇到过一些情况，其中IE呈现的方式与更符合标准的浏览器不同。使用conditional comments我可以使用IE特定的样式表修复这些差异。

Answer 3

您可以使用

检测IE浏览器

IE条件评论
CSS规则特定
条件HTML类

这是很棒的article，它显示了所有规则

CSS的浏览器检测：使用单独的CSS文件或内联CSS或......？

3 个答案: