HTML-тег <button>

Тег <button> создает интерактивную кнопку в форме HTML form.

Кнопки, созданные с помощью элемента <button>, аналогичны кнопкам, созданным с помощью элемента <input>, но они предоставляют более широкие возможности для кастомизации.

Так, вы можете в качестве содержимого элемента <button> вы можете поместить текст или изображение.

Тип:	Inline
Контент:	Любой блочный, инлайновый элемент, текст
Открывающий тег:	Обязательный
Закрывающий тег:	Обязательный
Версия:	HTML 4, 4.01, 5

Если вы используете тег <button> в форме HTML, учитывайте, что браузеры могут отправлять значения по разному. Internet Explorer, до 9 версии, отправит текст, содержащийся между открывающим и закрывающим тегом элемента кнопки, в то время как другие браузеры будут отправлять содержимое атрибута value.
В IE7 при отправке формы с <button type="submit" name="myButton" value="foo">Отправить</button> отправленные данные методом POST приведут к отправке myButton=Отправить вместо ожидаемого myButton=foo

Синтаксис

Базовый синтаксис тега <button> выглядит следующим образом:

HTML / XHTML: <button type="button|reset|submit"> ... </button>

Примеры написания кода тега <button>:

<form action="action.php" method="post">
    <p>
        Имя пользователя:<input type="text" name="firstname">
        <button type="submit" value="Submit">Отправить</button>
        <button type="reset" value="Reset">Сброс</button>
    </p>
</form>

Специальные атрибуты тега

В следующей таблице приведены атрибуты, которые относятся к тегу <button> tag.

Атрибут	Значение	Описание
`autofocus`	`autofocus`	Этот логический атрибут указывает, что кнопка должна автоматически получать фокус при загрузке документа.
`disabled`	`disabled`	Этот логический атрибут отключает кнопку для взаимодействия с пользователем.
`form`	form-id	Определяет элемент `<form>`, с которым связан элемент кнопки (его form owner)
`formaction`	URL	Определяет URL-программы, которая обрабатывает информацию, представленную кнопкой (только для `type="submit"`).
`formenctype`	`application/x-www-form-urlencoded` `multipart/form-data` `text/plain`	Указывает, как данные формы должны быть закодированы при отправке данных формы на сервер (только для `method="post"`)
`formmethod`	`get` `post`	Определяет метод HTTP, который браузер будет использовать для отправки формы (только для `type="submit"`).
`formnovalidate`	`formnovalidate`	Этот логический атрибут указывает, что данные формы не должны проверяться при отправке (только для `type="submit"`).
`formtarget`	`_blank` `_self` `_parent` `_top`	Указывает цель для отображения ответа, полученного после отправки формы.
`name`	unique-name	Представляет имя кнопки.
`type`	`button` `submit` `reset`	Определяет тип кнопки.
`value`	text	Определяет начальное значение кнопки.

Глобальные атрибуты

Как и все другие HTML-теги, тег <button> поддерживает все глобальные атрибуты в HTML5.

Атрибуты для событий

Тег <button> так же поддерживает атрибуты событий в HTML5.

Поддержка браузеров

Тег <button> поддерживается во всех основных браузерах.

Тег <button> следует использовать с осторожностью). Для безопасности, чтобы создать кнопки отправки в HTML-формах рекомендуется использовать тег <input>.