Не в традиційному розумінні, але ви можете використовувати для цього класи, якщо у вас є доступ до HTML. Врахуйте це:
<p class="normal">Text</p>
<p class="active">Text</p>
і у вашому CSS-файлі:
p.normal {
background-position : 150px 8px;
}
p.active {
background-position : 4px 8px;
}
Це CSS спосіб зробити це.
Потім є препроцесори CSS типу Sass . Ви можете використовувати там умовні умови , які виглядатимуть приблизно так:
$type: monster;
p {
@if $type == ocean {
color: blue;
} @else if $type == matador {
color: red;
} @else if $type == monster {
color: green;
} @else {
color: black;
}
}
Недоліками є те, що ви зобов’язані попередньо обробити свої таблиці стилів, і що умова оцінюється під час компіляції, а не час виконання.
Новішою особливістю власного CSS є власні властивості (так само змінні CSS). Вони оцінюються під час виконання (у браузерах, що їх підтримують).
З ними ви можете зробити щось уздовж:
:root {
--main-bg-color: brown;
}
.one {
background-color: var(--main-bg-color);
}
.two {
background-color: black;
}
Нарешті, ви можете попередньо обробити таблицю стилів улюбленою мовою на стороні сервера. Якщо ви використовуєте PHP, style.css.phpподайте файл, який виглядає приблизно так:
p {
background-position: <?php echo (@$_GET['foo'] == 'bar')? "150" : "4"; ?>px 8px;
}
У цьому випадку ви матимете вплив на продуктивність, оскільки кешування такої таблиці стилів буде складно.