Чтобы добавить кнопку в HTML и CSS, нужно выполнить следующие шаги:
- Создать элемент кнопки в HTML с помощью тега
<button>
илиinput type=»button»>`. Например:
<button>Нажми меня</button>
- Добавить стили для кнопки в CSS. Например:
button {
background-color: #4CAF50; /* Зеленый цвет фона */
color: white; /* Белый цвет текста */
padding: 12px 24px; /* Отступы внутри кнопки */
border: none; /* Убрать границу */
border-radius: 4px; /* Закруглить углы */
cursor: pointer; /* Изменить курсор при наведении */
}
- Добавить обработчик события для кнопки, если необходимо. Например:
<button onclick="alert('Привет, мир!')">Нажми меня</button>
Этот код вызовет всплывающее окно с текстом «Привет, мир!» при нажатии на кнопку.
Готовый пример:
<!DOCTYPE html>
<html>
<head>
<title>Моя кнопка</title>
<style>
button {
background-color: #4CAF50;
color: white;
padding: 12px 24px;
border: none;
border-radius: 4px;
cursor: pointer;
}
</style>
</head>
<body>
<button onclick="alert('Привет, мир!')">Нажми меня</button>
</body>
</html>