Расширение классов CSS

Question

Есть ли возможность расширить существующий класс, используя только css?

.darkStyle { 
     color:#eee; 
     background:#222; 
} 
.element { 

     // here I want to get all properties from darkStyle 

     min-width:100px; 
     display:block; 
} 

Я знаю, что я могу использовать в HTML класс = «darkStyle элемент», но любой метод расширения, как в моем примере будет более удобным для использования.

Answer 1

Используйте Less или Sass для этого.

В менее:

.element { 
    .darkStyle; // Will output all styles from .darkStyle; 
    min-width:100px; 
    display:block; 
} 

Answer 2

Назначают общие свойства, а затем присвоить уникальные свойства для .element. Это был бы единственный способ только с CSS. Вы можете использовать фреймворки CSS, такие как Less, для дополнительных функций, таких как наследование.

.darkStyle, .element { 
    color:#eee; 
    background:#222; 
} 

.element { 
    min-width:100px; 
    display:block; 
} 

Answer 3

Нет, вы не можете «расширить» классы. И вам не нужно, CSS не является языком программирования OO и имеет разные механизмы.

Например, классы могут быть объединены на данном HTML элемента:

<p class="darkStyle"> 
    I'm styled by styles applying to .darkStyle 
</p> 
<p class="darkStyle element"> 
    I'm styled by styles applying to both .darkStyle and .element 
</p> 

Multiclass!