较少的继承不起作用

时间:2018-05-10 13:35:37

标签: css inheritance less

您可以在下面的代码中查看吗?我想为类定义一些样式,然后为另一个类应用相同的样式。我已经使用了继承,但未使用父级的样式:

.parent-item {
  &:not(:last-child) {
    margin-right: 20px;
  }
}

.child-item {
  &:extend(.parent-item);
  //...
}

1 个答案:

答案 0 :(得分:2)

只需在课程名称

旁边添加所有字样
.child-item {
  &:extend(.parent-item all);
  //...
}

例如

.parent-item {
  color: green;
  background: red;
  &:not(:last-child) {
    margin-right: 20px;
  }

  &:last-child {
    color: red;
  }

  &:hover {
    color: red;
  }
}




.child-item {
  &:extend(.parent-item all);
  //...
}

结果将是

.parent-item,
.child-item {
  color: green;
  background: red;
}
.parent-item:not(:last-child),
.child-item:not(:last-child) {
  margin-right: 20px;
}
.parent-item:last-child,
.child-item:last-child {
  color: red;
}
.parent-item:hover,
.child-item:hover {
  color: red;
}