2010-06-04 73 views
1

我们有一个需要在IE6,7,8中工作的项目。过载级联样式表

我对样式表没有经验,但是我知道根据浏览器类型有多种方式来加载样式表。

我的问题是,是否有可能拥有所有浏览器将使用的主样式表,然后导入一个覆盖各种样式以考虑浏览器实现的额外的样式表,还是我需要每个浏览器只有一个CSS当需要完成解决方法时,它将具有大部分相同的代码。

也许我最近一直在做过多的OO,我已经习惯了我很好的继承等

回答

2

没有我知道的网站实际上为每个浏览器手动保留不同版本的CSS文件。通常,它们只保留主样式表和子样式表,如第一种情况,但是使用脚本将它们合并到一个静态文件中。维护每个浏览器的的所有 CSS样式的不同副本是不值得的麻烦。

你列出的都是有效的,并且有自己的优势的方法有两种:

主样式表与子样式表对每个浏览:这种方法是简单和正常工作。

  • 专业版:它不需要你有一个脚本来将浏览器特定的样式表与主样式表合并在显示给用户之前。
  • Con:需要加载更多的页面,这可能会慢一些; CSS precedence问题可能难以调试,因为CSS跨多个页面

合并的主样式表和浏览器特定的样式传播:这种方法非常适合(我的意思是)网站有很多请求:(例如雅虎,它有这个CSS文件,接受查询字符串来合并CSS文件);优点和缺点基本上与上述相反。

我建议您只选择第一个解决方案,除非您的网站非常大;用PHP和服务器端浏览器检测,代码可能是这样的:

echo "<link rel='stylesheet' type='text/css' href='/css/main.css' />\n"; 
$browser = get_browser(null, true); 
$browser = $browser['browser']; 
if ($browser == 'Firefox') { 
    echo "<link rel='stylesheet' type='text/css' href='/css/firefox.css' />\n"; 
} elseif ($browser == 'Internet Explorer') { 
... 

请注意,这是最好的,如果你的设计不需要浏览器特定CSS的。大多数情况下,这不是必需的,并且是由对CSS属性的错误理解造成的。要修复较小的默认浏览器差异,CSS库(例如YUI reset)可能会非常有帮助。

1

我肯定会走的样式表的级联自然优势。

我会包括一个base.css,然后如果你想,可以在每个浏览器的基础上添加一个样式表。

但是,我不会推荐它。一般来说,你可以让IE6 + 7玩球而不需要不同的样式表。

但是,如果您不能,请查看conditional comments