时间戳

首页 > 解决方案 > 如何使用 scss 父选择器来选择它的双选择器

css - 如何使用 scss 父选择器来选择它的双选择器

问题描述

我来了一个场景，我想在我的 sass 中引用我的父选择器，后来我想将父选择器添加到它的双选择器animate以在滚动时执行特定的动画。有没有办法我可以实现它。任何帮助，将不胜感激。我知道解释我的问题很棘手。希望下面的例子能解释我的需要。

CSS

.parent--selector.animate .child-selector {
  opacity: 1;
}
.parent--selector .child--selector {
  opacity:0;
  transition: 0.3s;
}

我想使用具有以下模式的 scss 来实现上述样式

SCSS

.child--selector {
  opacity: 0;
  transition: 0.3s;
  .parent--selector & {
    &.animate {
      opacity: 1;
    }
  }
}

标签： csssass

解决方案

Not quite clear, but I think I understood you correctly.

Rules must be written in parallel ...

.parent--selector {
  &.child--selector.animate {
    opacity: 1;
  }
  &.parent--selector {
    opacity: 0;
  }
}

If you show your html I will say more precisely, if of course I was mistaken in this example and did not understand correctly ...

推荐阅读