Могу ли я объединить 2+ стиля вместе в суперстиль?

Question

Я хотел объединить два стиля, чтобы создать супер-стиль для удобного использования и настройки моей страницы.

Можно ли определить что-то подобное? (если да, то как)

.bold { font-weight: bold;}
.color1 {color: white;}

.boldColor {.bold; .color1;}

where .boldColor is effectively

.boldColor {font-weight:bold; color:white;}

Я хочу, чтобы я мог иметь стили на всей странице и иметь возможность легко менять цвета во многих местах в одном месте. В настоящее время я использую <p class="bold color">, но некоторые из моих классов становятся длинными, поэтому я хотел бы иметь возможность использовать <p class="boldColor">

Спасибо

Answer 1

Вы не можете делать в точности то, что просите, но вы можете получить аналогичные эффекты, используя запятую для разделения нескольких селекторов CSS, которые имеют одинаковые свойства.

.bold, .boldColor {
    font-weight: bold;
}

.color1, .boldColor {
    color: white;
}

Таким образом class="boldColor" будет иметь тот же эффект, что и class="color1 bold".

Answer 2

Это невозможно при использовании обычного CSS. Обычно вы делаете это, как вы уже сказали, комбинируя имена классов: bold color

Существуют CSS-прекомпиляторы, которые могут выполнять сложные операции с таблицами стилей CSS, например работать с переменными. Я не знаю ни одного, который делает "слияние классов", как вы запрашиваете, но я уверен, что они могут помочь в уменьшении размера кода. Проверьте МЕНЬШЕ и xCSS , например.

Answer 3

Оформить LessCss ( .NET версия )

Answer 4

Нет, вы не можете сделать это. То, как вы делаете это в настоящее время, идеально.

Answer 5

Нет, спецификация CSS не поддерживает это.