減少 - 樣式類不同地依賴於父元素

Question

我有一些類似於下面的LESS樣式。在LESS中是否有一種技術能夠更好地處理我想要實現的內容，而不必在每個父元素下複製類名稱？

span { 

    .zero { 
     color: #fff; 
    } 
} 

div { 

    .zero { 
     color: #389c40; 
    } 
} 

Answer 1

嗯，你總是可以做

.zero { 
    span & { color: #fff; } 
    div & { color: #389c40; } 
} 

Answer 2

嘗試使用CSS變量：

:root{ 
    --zColor: #fff; 
} 
.zero{ 
    color: var(--zColor); 
} 
div{ 
    --zColor: #389c40; 
}