如何让多个样式表在单个页面上工作？答案

【问题标题】：How do I get Multiple Style Sheets to work on a single page?如何让多个样式表在单个页面上工作？
【发布时间】：2010-07-13 00:38:29
【问题描述】：

情况是这样的。

我为我目前正在处理的三个页面中的每个页面制作了三个样式表。一种适用于 IE8/Safari/Opera/Firefox。一种在 IE7 中运行，另一种在 IE6 上运行
我在 www.xenocode.com/browsers 以及该网站的 IE 6 和 7 模拟器上测试了所有内容。

3 我使用了文章建议的变体来使所有工作表都能正常工作。（在该部分：

http://www.thesitewizard.com/css/excludecss.shtml

问题是，虽然它为 IE 8 和 IE 7 在线调用了正确的 css（它直接在我的计算机上工作得很好），它似乎无法正确地在线调用 IE6 的代码，导致布局在 IE 6 中被搞砸了（或者至少是 xenocode.com 上的模拟器。

有没有更好的方法？

（由于我的客户坚持在项目完成之前不显示完整页面，因此无法显示完整页面。）

【问题讨论】：

您可以尝试 browsershots.org 进行页面渲染，因为他们在真正的浏览器中打开站点，而不是模拟器。可能有助于确定 IE 6 的问题所在。

标签： css layout html

【解决方案1】：

假设您使用的是浏览器条件语句...

我会检查您使用的模拟器是否能够解释浏览器条件语句。如果不确定，您总是可以禁用所有其他样式表并正常链接（使用链接标记）到 IE6 样式表，然后测试

【讨论】：

其实我就是这么做的。如果我只是将 ie6 css 链接起来，它在 IE6 模拟器上和离线时都可以正常工作。
您是否将 IE6 条件语句置于其他样式表之下？否则，由于 CSS 的级联性质，其他样式会覆盖您在 IE6 表中声明的任何内容，从而使效果无效

【解决方案2】：

你想拥有IE6 specific CSS？另外，请考虑使用Microsoft SuperPreview 在本地查看您的设计在各种版本的 IE6 中的外观。

【讨论】：

【解决方案3】：

您可以将这些 css 选择标签用于 IE 的特定浏览器版本。

<!--[if IE 6]><link rel="stylesheet" type="text/css" href="/css/ie60.css" /><![endif]-->
<!--[if IE 5.5000]><link rel="stylesheet" type="text/css" href="/css/ie55.css" /><![endif]-->
<!--[if lt IE 5.5000]><link rel="stylesheet" type="text/css" href="/css/ie50.css" /><![endif]-->

【讨论】：

您也可以查看这个模块化 Css 幻灯片 barbarosalp.com/post/2009/02/26/Moduler-CSS.aspx
要针对所有非 IE（不仅仅是 Firefox），请使用（此处为非 IE 样式表）

【解决方案4】：

http://rafael.adm.br/css_browser_selector/

我喜欢这个东西，因为它让我可以为不同的浏览器/操作系统详细定义我想要的所有更改。

【讨论】：