一个好例子

Question

我有一个CSS属性：

top:20px;

Internet Explorer没有问题，但FireFox没有。应该是对于Firefox：

top:0px;

如何在CSS中添加有条件的情况？

Answer 1

找到这段可能对你有用的脚本here。

   // This function returns Internet Explorer's major version number,
   // or 0 for others. It works by finding the "MSIE " string and
   // extracting the version number following the space, up to the decimal
   // point, ignoring the minor version number
   <SCRIPT LANGUAGE="JavaSCRIPT">
   function msieversion()
   {
      var ua = window.navigator.userAgent
      var msie = ua.indexOf ( "MSIE " )

      if ( msie > 0 )      // If Internet Explorer, return version number
         return parseInt (ua.substring (msie+5, ua.indexOf (".", msie )))
      else                 // If another browser, return 0
         return 0

   }
   </SCRIPT>

作为一个注释，css用于样式您的工作表，因此您需要通过javascript或其他脚本语言添加此css。

对于你需要的东西来说有点过分，但是将其剥离（以便得不到版本号）。它为您的测试奠定了良好的基础。

一个好例子

以下示例演示如何从客户端脚本检测浏览器版本。请注意，此示例并未专门检查平台版本，例如Windows 95，Windows＆gt; NT，Windows 3.1等，它们在适用时需要单独的userAgent子字符串检查：

<SCRIPT LANGUAGE="javascript">
   if ( msieversion() >= 4 )

      document.write ( "This is Internet Explorer 4 or later" );

   else if ( msieversion() >= 3 )

      document.write ( "This is Internet Explorer 3" );

   else

      document.write ( "This is another browser" );

   </SCRIPT>

Answer 2

您可以将以下条件语句添加到CSS

中

@-moz-document url-prefix() {
    .className {
        top:0px;
    }
}

@-moz-document url-prefix()之间的任何CSS都只适用于Firefox。

但也许更好的选择是将条件应用于IE。您可以将top:0px;留在当前的CSS中，并在文档的head中为IE添加以下条件。

<!--[if IE]>
   <style>
      .className {
         top:20px;
      }
   </style>
<![endif]-->

注意：IE10 +

不支持条件注释

Answer 3

<!--[if IE]>
    <style>
        #element{top: 20px;}
    </style>
<![end if]-->

适用于IE的条件评论。

根据浏览器的CSS属性条件

3 个答案:

一个好例子