Чтобы создать рабочую кнопку в CSS, можно использовать стандартное свойство «background-color» для задания цвета фона кнопки. Кроме того, можно использовать свойства «color» и «font-size» для задания цвета текста и его размера, а свойства «padding» и «border-radius» для создания отступов и скругления углов кнопки. Ниже приведен пример кода, который создает рабочую кнопку:
.button {
background-color: #4CAF50; /* цвет фона */
color: white; /* цвет текста */
font-size: 16px; /* размер текста */
padding: 10px 20px; /* отступы сверху/снизу и слева/справа кнопки */
border-radius: 5px; /* скругление углов */
border: none; /* убирает границу */
cursor: pointer; /* менять вид курсора при наведении на кнопку */
}
В этом примере кода классу «button» задаются стили, такие как цвет фона, цвет текста, размер текста, отступы и скругление углов. «border: none;» убирает границу, а «cursor: pointer;» указывает браузеру, что на кнопку можно нажимать.
Чтобы создать действие при нажатии на кнопку, нужно добавить к кнопке соответствующий атрибут «onclick» и задать ему функцию JavaScript. Например:
<button class="button" onclick="alert('Кнопка нажата!')">Нажми меня</button>
В этом примере при нажатии на кнопку «Нажми меня» будет вызван диалоговый окно с сообщением «Кнопка нажата!». Обратите внимание, что функцию можно задать не только в атрибуте «onclick», но и внутри сценария скрипта.