kwork banner 468x60kwork banner 728x90kwork banner 930x180etxt banner 468x60etxt banner 728x90etxt banner 930x180skillbox banner 468x60skillbox banner 728x90skillbox banner 930x180

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>.
kwork banner 480x320kwork banner 728x90kwork banner 120x600skillbox banner 480x320skillbox banner 728x90skillbox banner 120x600beget banner 480x320beget banner 728x90beget banner 120x600

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

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

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

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

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

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