scss 简单的媒体查询Sass mixin可以让你考虑像素宽度，但输出是在ems中。

Posted 2021-05-18

//Mobile-first Media Query Mixin
@mixin forLargeScreens($media) {
  @media (min-width: $media/16+em) { @content; }
}

//Usage
.selector {
   width: 100%; //Properties for small screens
   @include forLargeScreens(640) { // 640 ÷ 16 = 40
      width: 50%; //Properties for large screens
   }
}

//Compiles to
.selector {
  width: 100%;
}
@media (min-width: 40em) {
  .selector {
    width: 50%;
  }
}