Sass断点不起作用

Question

我检查了所有可能性，并且没有看到任何问题。

config.rb

有以下行：require 'breakpoint'

style.scss

也@import "breakpoint";

我试着这样：

$medium: 96rem; // or even $medium: 51rem 96rem;

.any-class{
    @include breakpoint($medium);
    //change any property
}

我在编译的css文件中看不到任何影响，只有新属性会覆盖以前的属性。 我使用Sass 3.4.13 (Selective Steve)和Compass 1.0.1 (Polaris)。

编辑： 样本编译结果：

//Sass
html{
    font-size: 62.5%;
}
body{
    @include breakpoint(100rem);
    background-color: #000;
}

编译：

//Css
html {
  font-size: 62.5%;
}
body {
}
body {
  background-color: #000;
}

Answer 1

那是因为你错误地使用了mixin。断点mixin是一个@content意识混合，用于mixin的样式需要放在花括号内：

body{
    @include breakpoint(100rem) {
      background-color: #000;
    }
}

输出：

@media (min-width: 100rem) {
  body {
    background-color: #000;
  }
}