时间戳

首页 > 解决方案 > 如何有条件地在css中应用样式

css - 如何有条件地在css中应用样式

问题描述

如何在 magento2 的每个页面正文上使用两个不同的父类来应用相同的样式。就像我在 scss 文件中需要它一样，它具有深层嵌套结构，但每个页面只有其顶部父级更改。例如我想要这个

    class1 or class 2{
         class3{
             class5{

              }
         }
         class4{
         }
    }
enter code here

我想如果它的 class1 或 class2 出现在 html 中，则应该应用此样式。谢谢

标签： csssass

解决方案

用逗号分隔定义你的根类

.class1, .class2 {
   /* other selectors here */
}

所以 SASS 会将这段代码编译成

.class1 {
   /* other selectors here */
}

.class2 {
   /* other selectors here */
}

无论如何，值得一提的是，使用多个类作为范围的祖先会在输出中创建冗余的 CSS 代码，尝试找到单个选择器可能很有用（如果可能，例如，magento 可能只允许为两个页面放置一个特定的类?)

推荐阅读