Question

如果是CSS，我可以在另一条规则的声明中调用规则吗？像这样：

.myFirstRule
{
    color: white;
}

.mySecondRule
{
    width: 1000px;
    myFirstRule;
}

谢谢。

抱歉我的英文

Answer 1

在CSS中，不，你不能。但是，您可以一次将样式应用于多个选择器，例如：

.myFirstRule, .mySecondRule { color: white; }

确保每个选择器都用逗号分隔，你就可以了。

Answer 2

您无法在纯CSS中执行此操作，但有两种解决方案可以解决您的问题：

一：使用多个选择器

<div class="myFirstRule mySecondRule"></div>

二：使用SASS（或者我认为很少）

.myFirstRule {
  color: white;
}
.mySecondRule {
  width: 1000px;
  .myFirstRule;
}

或，仍然使用SASS，您也可以使用mixin执行此操作：

// Define here
@mixin reusableRule {
  color: white;
}

.myFirstRule {
  @include reusableRule;
}
.mySecondRule {
  width: 1000px;
  @include reusableRule;
}

Answer 3

不，您不能在纯CSS中执行此操作..您可以使用逗号或,将属性应用于多个选择器

试试这个：

.myFirstRule, .mySecondRule {
    color:white;
}

.mySecondRule
{
    width: 1000px;
}

Answer 4

普通的CSS无法做到这一点，但您可以尝试使用SASS或LESS来编译CSS。他们通过“mixins”允许这种行为。

例如，在LESS，您可以这样做：

.myFirstRule
{
    color: white;
}

.mySecondRule
{
    width: 1000px;
    .myFirstRule;
}

会生成CSS：

.myFirstRule
{
    color: white;
}

.mySecondRule
{
    width: 1000px;
    color: white;
}

在另一个CSS规则的语句中调用CSS规则？

4 个答案: