为特定浏览器使用不同的CSS样式

StackOverflow https://stackoverflow.com/questions/1637534

  •  07-07-2019
  •  | 
  •  

题

为IE和其他浏览器提供单独的CSS的最佳方法是什么？我想的只是针对IE，Firefox和Safari用户。特别是现在大多数浏览器都支持CSS3，但是IE。

我遇到的各种方法是

  1. 加载单独的样式表 有条件地使用<!--[if IE] <！> gt;
  2. 强调黑客和其他各种内联IE黑客攻击

    3. 我更喜欢（2）因为（1）是额外的工作，特别是在开发时。但是（2）似乎并不总是有效。什么是最有效的方式？

有帮助吗？

解决方案

我会有一个样式表，所有内容都会在文档的顶部显示。

在这下面做你的        [！ - [如果IE]] 条件样式表。

在这里只是覆盖导致IE出现问题的样式。 - 拾取的特定类的最后一种风格是将遵循的风格。

其他提示

我们的团队按照以下三条规则处理CSS：

  1. 确保常规/常见CSS文件尽可能地与所有浏览器一起工作。
  2. 处理所有IE <！>“错误<！>”;在单独的文件中，控制使用IE条件加载样式表。
  3. 除非在前两条规则之后无法使其工作，否则不允许任何黑客攻击。

我同意将所有核心CSS保存在一个文件中。如果您使用的是ASP.NET，那么您可以使用WebHandler来管理实际发送的CSS。我敢肯定其他语言也有类似的解决方案。这允许您只发送您需要的内容并允许它被缓存。另一个好处是你可以组合多个css文件（如果你是这样做的）并且只提供一个。这是一种很好的做法，因为您减少了对Web服务器的请求数量。

然后你可以写[if lt IE 8] margin：0px;它不会被发送到IE8或FF等。

如果您只是使用HTML，那么您必须使用上面提到的[！ - [if IE]]样式条件。

我们在一个非常大的项目中使用WebHandler，我不会以任何其他方式进行。

请参阅 http://www.conditional-css.com/download 。它适用于PHP，C＃和C

祝你好运。

<!--[if !IE]><!--><link rel="stylesheet" href="non-ie.css"><!--<![endif]-->
<!--[if IE]><link rel="stylesheet" href="ie.css"><![endif]-->

这个技巧广泛使用Yandex（又名<！>;俄语google <！>;;）来减少HTTP请求。例如， market.yandex.ru 使用此功能。

您也可以使用这种方式;有时我们需要在代码中间编写样式的条件可能不起作用。

<?php $browser = $_SERVER['HTTP_USER_AGENT']; ?>  
    <?php if (strstr($browser, "MSIE 6.0")) { ?>  
    <link rel="stylesheet" href="ie6style.css" type="text/css" media="screen" />  
    <?php }else{ ?>  
    <link rel="stylesheet" href="default.css" type="text/css" media="screen" />  
    <?php } ?>

检查$browser with：

IE <！>＃8211; <！> 8220＃; MSIE＃8221 <！>;

Firefox <！>＃8211; <！> 8220＃;火狐＃8221 <！>;

Safari <！>＃8211; <！> 8220＃; Safari的＃8221 <！>;

Opera <！>＃8211; <！> 8220＃;歌剧＃8221 <！>;

Chrome <！>＃8211; <！> 8220＃;铬＃8221 <！>;

许可以下： CC-BY-SA 和 归因
不隶属于 StackOverflow
scroll top