Показать сообщение отдельно
  #2 (permalink)  
Старый 19.09.2023, 23:41
Аватар для Aetae
Тлен
Отправить личное сообщение для Aetae Посмотреть профиль Найти все сообщения от Aetae
 
Регистрация: 02.01.2010
Сообщений: 6,491

<ul class="nav-list-1">
     <li data-filter="red" class="nav-list__item">Красный</li>
     <li data-filter="green" class="nav-list__item">Зеленый</li>
     <li data-filter="blue" class="nav-list__item">Синий</li>
     <li data-filter="gray" class="nav-list__item">Сброс</li>
</ul>
<style> 
  [data-filter="red"]:active {
    color: red
  }  
  [data-filter="green"]:active {
    color: green
  }  
  [data-filter="blue"]:active {
    color: blue
  }  
  [data-filter="gray"]:active {
    color: gray
  }  
</style>

<ul class="nav-list-2">
     <li style="--active-color: red" class="nav-list__item">Красный</li>
     <li style="--active-color: green" class="nav-list__item">Зеленый</li>
     <li style="--active-color: blue" class="nav-list__item">Синий</li>
     <li style="--active-color: gray" class="nav-list__item">Сброс</li>
</ul>
<style> 
  .nav-list-2 > li:active {
    color: var(--active-color);
  }  
</style>
__________________
29375, 35
Ответить с цитированием