Чтобы сделать кнопку кликабельной с помощью CSS, вы можете использовать псевдокласс :hover, который применяется к элементу при наведении на него курсора мыши.

.button {
  padding: 10px 20px;
  background-color: #1e90ff;
  color: #fff;
  border: none;
  border-radius: 5px;
  cursor: pointer;
}

.button:hover {
  background-color: #007fff;
}

В приведенном выше примере .button – это класс кнопки, которая имеет свойства стиля, такие как padding, background-color, color, border, border-radius и cursor. Когда наводим курсор мыши на кнопке, на нее применяется псевдокласс :hover и изменяется ее фоновый цвет на более темный цвет синего.

Вы можете дополнительно добавить стили для других псевдоклассов, таких как :active (применяется, когда кнопка нажата), :visited (для посещенных ссылок) и :focus (для активирования элемента с помощью клавиатуры).

.button:active {
  background-color: #0051a8;
}

.button:visited {
  color: #ccc;
}

.button:focus {
  outline: none;
  box-shadow: 0 0 4px #1e90ff;
}

В приведенном выше примере добавлены стили для псевдоклассов :active, :visited и :focus.