Question

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

    class1 or class 2{
         class3{
             class5{

              }
         }
         class4{
         }
    }
enter code here

我想如果它的class1或class2都是html，那么这个样式应该适用。感谢

Answer 1

定义您的 root 类以逗号分隔

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

所以SASS会将此代码编译成

.class1 {
   /* other selectors here */
}

.class2 {
   /* other selectors here */
}

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

Answer 2

你可以做这样的事情

.class1, .class2 {

         .class3 {
               /*your style */
              .class5 {
                  /*your style */
              }
         }

         class4 {
            /*your style */
         }
    }

只有父类.class1 or .class2才会将样式应用于class3, class5, and class4

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

2 个答案: