代码之家 › 专栏 › 技术社区 › Zeth

检查body类的SCS的混合

sass

Zeth · 技术社区 · 6 年前

#logo {
  position: absolute;
  top: 50px;
  left: 20px;
} 

body.admin-bar #logo {

  #logo {
    top: 86px;

    @media screen and (max-width: 782px) {
      top: 92px;
    }
  }
}

... 对此

#logo {
  position: absolute;
  @include adminAdjustedTop( 50px );
  left: 20px;
}

所以 adminAdjustedTop mixin然后将额外的像素添加到顶部,如果 body admin-bar

1 回复 | 直到 6 年前

Flying 6 年前

parent selector reference &

#logo {
  position: absolute;
  top: 50px;
  left: 20px; 
  body.admin-bar & {
    top: 86px;
    @media screen and (max-width: 782px) {
      top: 92px;
    }
  }
}

推荐文章

delves · Sass不识别变量

3 年前

Nathan Huber · 如何在React 18中使用“useEffect”

3 年前

Janosz ÐÑÐ°ÑÐ¸ÑÐ½Ð¸Ðº · 如何瞄准这个i标签

3 年前

Henry · scss或css中的calc函数不起作用

3 年前

Nam Van · 如何在React中使用自定义主题颜色。js,CSS(SCSS)模块,Bootstrap5

3 年前

rook99 · 无法加载图标的字体

7 年前

Glen Elkins · SASS新手-不编译

7 年前

Toki · SASS在Sublime Text-Compile main中。保存任何@导入文件时的scss

7 年前

zed · 防止SCS编译CSS变量-Angular CLI

7 年前

sliptype · 使用Webpack提取CSS时抑制模块输出

7 年前