Псевдо класс на подобии Focus?

Question

[Quipee]

Нужно чтобы кнопка при нажатии становилась другим цветом,
пока не нажать на другую, возможно не css.
наподобие

.knopka:focus{
color: yellow;
}

и почему когда focus кнопку надо как бы захватить и перетащить а если просто тыкнуть на неё она не меняет цвет.

Comments

[Rustam Bainazarov]

:hover
:active

Вообще и в целом, :focus — для полей, а не кнопок.

[Quipee]

Рустам Байназаров, неет, мне нужно что бы когда я убрал мышку с кнопки, она оставалась с изменённым цветом

[Rustam Bainazarov]

Quipee, вам не к CSS тогда. Так можно сделать только если пользователь будет держать левую клавишу мыши зажатой (:active). Такой вариант будет работать, даже если он отведёт мышь в сторону.

[Quipee]

Рустам Байназаров, но мне надо, именно чтобы 1 раз нажал и она горела другим цветом

[Rustam Bainazarov]

Quipee, как я уже и сказал, вас ждёт JS :))

Answer 1

[0xD34F]

скрытые радиокнопки:

<label class="button">
  <input type="radio" name="button">
  <span>click me</span>
</label>

<label class="button">
  <input type="radio" name="button">
  <span>click me</span>
</label>

.button input {
  display: none;
}

.button input:checked + span {
  background: red;
  color: white;
}

Comments

[Quipee]

спасибо, огромное