断点 sass 混合答案

【问题标题】：Breakpoint sass mixin断点 sass 混合
【发布时间】：2022-01-20 01:18:42
【问题描述】：

非常非常简单的 HTML SASS 为什么断点不起作用，不改变背景，不扩大表格大小 HTML <table >nocontent</table>

CSS

$lg: 992px;
$xl: 1200px;
$xxl: 1400px;

$md : 768px;
@mixin for-up($size) {

  @media screen and (max-device-width: $size) {
    @content;

  }

  .table-main {
    height: 100vh;
    border: greenyellow solid;

    @include for-up($sm)
    {
      background-color: black;
      width: 100%;
      max-width: none;
    }
  }
}

【问题讨论】：

你忘了用}关闭mixin

标签： html css sass media

【解决方案1】：

$md : 768px;
@mixin for-up($size) {

  @media screen and (max-device-width: $size) {
    @content;

  }

.table-main {
  height: 100vh;
  border: greenyellow solid;

@include for-up($md)
  {
      background-color: black;
      width: 100%;
      max-width: none;
  }
  }
}

只需添加正确的开始和结束括号，然后就可以了。

【讨论】：