Основний вміст

  • <body>

Тег <button>

Тег <button> в HTML: Повний огляд

Тег <button> створює кнопки на веб-сторінці та надає розширені можливості порівняно з тегом <input>. Він дозволяє розміщувати будь-які HTML-елементи на кнопці, включаючи зображення. За допомогою стилів можна змінювати вигляд кнопки, змінюючи шрифт, колір фону та інші параметри.

Тег <button> повинен розміщуватися всередині форми, але браузери не видають помилок, якщо він зустрічається самостійно. Проте, якщо потрібно відправити результат натискання кнопки на сервер, тег <button> обов'язково повинен бути в контейнері <form>.

Синтаксис

<form>
  <button>...</button>
</form>

Атрибути

accesskey
Доступ до елементів форми за допомогою гарячих клавіш.
autofocus
Встановлює, що кнопка отримає фокус після завантаження сторінки.
disabled
Блокує доступ та змінення елемента.

Закриваючий тег

Обов'язковий.

Приклад

<!DOCTYPE HTML>
<html>
 <head>
  <meta charset="utf-8">
  <title>Тег BUTTON</title>
 </head>
 <body>
  <p style="text-align: center"><button>Кнопка з текстом</button>
  <button><img src="images/umbrella.gif" alt="Зонтик" 
          style="vertical-align: middle"> Кнопка з малюнком</button></p>
 </body>
</html>

Браузери

Internet Explorer до версії 7.0 не підтримує атрибут value.

Часті запитання

  • Q: Як використовувати тег <button> в HTML?

    A: Тег <button> використовується для створення кнопки на веб-сторінці. Приклад: <button>Натисни мене</button>

  • Q: Як задати текст кнопки за допомогою тега <button>?

    A: Текст кнопки задається між відкриваючим і закриваючим тегами <button>. Наприклад: <button>Клікніть тут</button>

  • Q: Як додати обробник подій до кнопки <button> в HTML?

    A: Для додавання обробника подій до кнопки використовується атрибут onclick. Приклад: <button onclick='myFunction()'>Натисни мене</button>

  • Q: Як стилізувати кнопку <button> за допомогою CSS?

    A: Кнопку <button> можна стилізувати за допомогою CSS вказавши селектор button. Наприклад: button { background-color: #4CAF50; color: white; }

  • Q: Як використовувати тег <button> для відправки форми в HTML?

    A: Для використання кнопки <button> для відправки форми, використовується атрибут type='submit'. Приклад: <button type='submit'>Надіслати</button>