css - 一个类下的 CSS 类

Question

这个问题可能很愚蠢，虽然我想从 CSS 专家那里知道。有没有办法在一个类下编写 CSS 类。

假设我在一个 div 下有几个 div

<div class="parent">
     <div class="c1"></div>
     <div class="c2"></div>
     <div class="c3"></div>
</div>

通常，我们编写如下 css 类 -

.parent { width: 100%; }
.parent .c1 { //somecode }
.parent .c2 { //somecode }
.parent .c3 { //somecode }

但是，我想知道。我们可以像下面这样写 -

.parent {
    width: 100%;
   .c1 {
      //somecode
   }
   .c2 {
      //somecode
   }
   .c3 {
      //somecode
   }
}

请让我知道我的好奇心的答案。谢谢。

score 1 · Accepted Answer

你不能使用普通的CSS。

也许你正在寻找更少？特别是页面下方的嵌套规则部分。

这允许你做你所要求的，以及许多其他有用的函数、变量和 mixin。

或者，还有SASS的选项。这与less非常相似。

score 0 · Accepted Answer

CSS 做不到，但LESS和SASS可以。

请注意，这些是 CSS 编译器，因此它们需要一个编译步骤并为您生成所需的 CSS（而不是您手动编写所有内容）。

score 0 · Accepted Answer

听起来您正在寻找类似于嵌套或选择器继承的东西。

这可以通过 SASS 完成。与LESS非常相似。http://sass-lang.com/

score 0 · Accepted Answer

不，你不能使用普通的css，但出于可读性的目的，如果你不打算在父类以外的任何东西中使用.c1-3，那么你可以缩进你的CSS并做

.parent {
    width: 100%;
}
   .c1 {
      //somecode
   }
   .c2 {
      //somecode
   }
   .c3 {
      //somecode
   }

通过这种方式，您可以在代码中轻松查看哪些类属于哪些父类。（如果你不想走 LESS SASS 路线

4 回答 4