css - 如何删除 LESS 中的重复属性

Question

我有一些 LESS 代码:

.text-wraper {
  width: 50%;
  height:200px;
  h2 {
    margin: 10px 15px;
    padding: 0px;
  }
}

.sucess-wraper-header {
  width: 100%;
  background-color: #f2f2f2;
  &,
  .text-wraper,
  h2 {
    margin: 10px 15px;
    padding: 0px;
    span {
      color: red;
    }
  }
}

请注意这里有一点重复，即

h2 {
    margin: 10px 15px;
    padding: 0px;
  }

我们可以在包装外推杆。但是我们对 h2 有不同的样式。我们可以在 LESS 中删除这个重复吗？

谢谢

Answer 1

您可以混合这些属性:

.heading() {
margin: 10px 15px;
padding: 0px;
}

.text-wraper {
  width: 50%;
  height:200px;
  h2 {
    .heading();
  }
}

.sucess-wraper-header {
  width: 100%;
  background-color: #f2f2f2;
  &,
  .text-wraper,
  h2 {
    .heading();
    span {
      color: red;
    }
  }
}