css - 如何在 SCSS 中定位 firefox 或任何其他浏览器？

Question

glyphicon 未对齐，在 Firefox 中表现不正常，但在 Chrome 和 Safari 中看起来很完美。为了解决这个问题，我正在尝试编写一条规则，如果它是 Mozilla 的浏览器，该规则将适用。

有没有办法通过使用@if 之类的指令来检测SCSS 中的浏览器。类似以下内容:

@if $browser === mozilla {
    //apply this CSS
   .pull-right.glyphicon.glyphicon-chevron-right {
    top: -13px;
    line-height: 0.5 !important;
}

我们有什么简单的检测方法吗？我尝试使用在 SCSS 中不起作用的 @moz-document url-prefix()。

有人问了类似的问题here但问题没有正确的解决办法。

非常感谢任何帮助或指导。谢谢。

Answer 1

设法让 scss 在前缀规则用于混合时进行编译，但在其他情况下则不然:

@mixin firefox-only {
  @at-root {
    @-moz-document url-prefix() {
      & {
        @content;
      }
    }
  }
}

然后

@include firefox-only {
  prop: val;
}