LESS resusable嵌套類

Question

比方說，我有以下幾點：

.class-1 { 
    font-weight: bold; 
    p{ 
    color: red; 
    } 
} 

而且我要在更短的定義一個類-2具有與在1類p元素相同的樣式。除了編寫代碼之外，還有什麼方法可以這樣做嗎？

Answer 1

.class-1, .class-2 { 
    font-weight: bold; 
    p{ 
     color: red; 
    } 
} 

Answer 2

如果我理解正確的話，你希望你的風格，如果p它的class-1或class-2孩子。但class-1和class-2應具有不同的樣式。

我建議您將它寫出兩次或採用其他方法，但如果您不想將其寫出兩次，則可以使用mixins。

LESS

.p() { 
    color:red; 
} 

.class-1 { 
    font-weight: bold; 
    p{ 
    .p; 
    } 
} 
.class-2{ 
    p{ 
    .p; 
    } 
} 

CSS輸出

.class-1 { 
    font-weight: bold; 
} 
.class-1 p { 
    color: red; 
} 
.class-2 p { 
    color: red; 
}