Наследовать собственность css из другого имущества другого класса

Question

Есть ли способ заставить нижеследующее работать?

.class1 { 
line-height:20px; 
} 

.class2 { 
    height: class1.line-height; 
} 

Я знаю, что CSS переменных будет путь, но так как он находится в экспериментальной фазе, она не будет подходящей для нашего проекта. Есть ли другой путь?

Answer 1

Вы не можете использовать зависимости в CSS без препроцессора, такие как или LESS. Но вы можете применить более одного класса к HTML .....

<div class="class1 class2"></div>

В этом случае class1 будет содержать высоту строки, то class2 будет содержать любые другие свойства, которые необходимо применить к этому конкретный div.

Любые подобные свойства между class1 и class2 позволит class2 иметь приоритет, так как он будет загружен после class 1, предполагая, что иерархия CSS логично.

Например:

.class1 { line-height: 1.3; background-color: red;} 
.class2 { background-color: blue; } 

DIV будет иметь высоту строки в 1.3x и цвет фона синий.

Answer 2

да .. вы не можете использовать зависимости, подобные CSS. вы должны использовать SASS или LESS ..

вы можете сделать, как это в SASS

.class1 { 
    line-height:20px; 
    } 

.class2 { 
    @extend.class1 
}