Тег <BUTTON>

Internet Explorer			Chrome			Opera			Safari			Firefox
6.0	7.0	8.0	2.0	3.0	4.0	9.2	9.6	10	2.0	3.1	4.0	2.0	3.0	3.6

HTML:

3.2

XHTML:

1.0

1.1

Описание

Тег <BUTTON> создает на веб-странице кнопки и по своему действию напоминает результат, получаемый с помощью тега <INPUT> (с параметром type="button | reset | submit"). В отличие от этого тега, <BUTTON> предлагает расширенные возможности по созданию кнопок. Например, на подобной кнопке можно размещать любые элементы HTML, в том числе изображения. Используя стили можно определить вид кнопки путем изменения шрифта, цвета фона, размеров и других параметров.

Теоретически, тег <BUTTON> должен располагаться внутри формы, устанавливаемой элементом <FORM>. Тем не менее, браузеры не выводят сообщение об ошибке и корректно работают с тегом <BUTTON>, если он встречается самостоятельно. Однако, если необходимо результат нажатия на кнопку отправить на сервер, помещать <BUTTON> в контейнер <FORM> обязательно.

Синтаксис

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

Параметры

disabled: Блокирует доступ и изменение элемента.
name: Определяет уникальное имя кнопки.
type: Тип кнопки — обычная, для отправки данных формы на сервер или для очистки формы.
value: Значение кнопки, которое будет отправлено на сервер или прочитано с помощью сприптов.

Закрывающий тег

Обязателен.

Пример. Использование тега <BUTTON>

HTML 4.01IE 6IE 7IE 8Cr 4.0Op 10Sa 4Ff 3.0

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
 <head>
  <meta http-equiv="Content-Type" content="text/html; 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>

Результат данного примера показан ни рис. 1.

Рис. 1

Рис. 1. Вид кнопок в браузере Opera

Браузеры

Internet Explorer до версии 7 включительно не поддерживает параметр value.