如何使用Less來繼承CSS？

Question

我想創建以下<table>傳奇色彩有匹配在引導樣式如定義：

.table > thead > tr > td.warning, .table > tbody > tr > td.warning, .table > tfoot > tr > td.warning, .table > thead > tr > th.warning, .table > tbody > tr > th.warning, .table > tfoot > tr > th.warning, .table > thead > tr.warning > td, .table > tbody > tr.warning > td, .table > tfoot > tr.warning > td, .table > thead > tr.warning > th, .table > tbody > tr.warning > th, .table > tfoot > tr.warning > th { 
    background-color: #fcf8e3; 
    border-color: #fbeed5; 
} 

我的方法是定義固定寬度/高度DIV併爲它分配在以下文件，其中定義的類DIV的類繼承上面CSS中定義的顏色。

我還不明白的是如何對LESS編譯器進行說明：「從.table > tbody > tr > td.warning獲取屬性並插入此處」？

可能嗎？

Answer 1

您可以使用&:extend(.table > thead > tr > td.warning);自己的類內從該元素繼承：

View the CSS output on LESS Playground

.table > thead > tr > td.warning, .table > tbody > tr > td.warning, .table > tfoot > tr > td.warning, .table > thead > tr > th.warning, .table > tbody > tr > th.warning, .table > tfoot > tr > th.warning, .table > thead > tr.warning > td, .table > tbody > tr.warning > td, .table > tfoot > tr.warning > td, .table > thead > tr.warning > th, .table > tbody > tr.warning > th, .table > tfoot > tr.warning > th { 
    background-color: #fcf8e3; 
    border-color: #fbeed5; 
} 

div { 
    &:extend(.table > thead > tr > td.warning); 
    color: blue; 
}