jivo banner 468x60jivo banner 728x90jivo banner 930x180beget banner 468x60beget banner 728x90beget banner 930x180flexbe banner 468x60flexbe banner 728x90flexbe banner 930x180

Тег <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>.
beget banner 480x320beget banner 728x90beget banner 120x600smsc banner 480x320smsc banner 728x90smsc banner 120x600etxt banner 480x320etxt banner 728x90etxt banner 120x600

Читайте также

Насколько публикация полезна?

Нажмите на звезду, чтобы оценить!

Средняя оценка 5 / 5. Количество оценок: 1

Оценок пока нет. Поставьте оценку первым.

Похожие посты

HTML-тег <header>

Определяет заголовок документа или раздела

HTML-тег <base>

Определяет базовый URL для всех связанных объектов на странице

HTML-тег <legend>

Определяет заголовок для элемента <fieldset>