ОписаниеТег <BUTTON> создает на web-странице кнопки и по своему действию напоминает результат, получаемый с помощью тега <INPUT> (с параметром type="button | reset | submit"). В отличие от этого тега, <BUTTON> предлагает расширенные возможности по созданию кнопок. К примеру, на подобной кнопке можно размещать любые элементы HTML, в том числе изображения. Используя стили можно определить вид кнопки путем изменения шрифта, цвета фона, размеров и других параметров. Теоретически, тег <BUTTON> должен располагаться внутри формы, устанавливаемой элементом <FORM>. Тем не менее, браузеры не выводят сообщение об ошибке и корректно работают с тегом <BUTTON>, если он встречается самостоятельно. Однако, если необходимо результат нажатия на кнопку отправить на сервер, помещать <BUTTON> в контейнер <FORM> обязательно. Синтаксис<form>
<button>...</button> </form> Параметры
Закрывающий тегОбязателен. Пример 1. Использование тега <BUTTON>  <!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=windows-1251"> <title>Пример использования тега BUTTON</title> </head> <body> <p style="text-align: center"><button>Это кнопка с текстом</button> <button><img src="/images/guestbook1.gif" alt="Гостевая книга" style="vertical-align: middle"> Кнопка с рисунком</button></p> </body> </html> Описание параметров тега <BUTTON>Параметр DISABLED
ОписаниеДанный параметр блокирует доступ и изменение кнопки. Кнопка в таком случае отображается серой и недоступной для активации пользователем. Помимо того, такая кнопка не может получить фокус путем нажатия на клавишу Tab, мышью или другим способом. Тем не менее, такое состояние кнопки можно изменять через скрипты. Синтаксис<button disabled>...</button>
АргументыНет. Значение по умолчаниюПо умолчанию это значение выключено. Пример 2. Использование параметра disabled <!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=windows-1251"> <title>Пример тега BUTTON, параметр disabled</title> </head> <body> <form action=""> <p><button>Активная кнопка</button> <button disabled>Неактивная кнопка</button></p> </form> </body> </html> Параметр TYPE
ОписаниеЗадает тип кнопки, который задает ее поведение в форме. По внешнему виду кнопки разного типа никак не различаются, но у каждой такой кнопки свои функции. Синтаксис<button type="button | reset | submit">...</button>
Аргументы
Значение по умолчаниюbutton Пример 3. Использование параметра type <!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=windows-1251"> <title>Пример тега BUTTON, параметр type</title> </head> <body> <form action="/test.php"> <p>...</p> <p><button type="reset">Очистить форму</button> <button type="submit">Отправить форму</button></p> </form> </body> </html> Параметр VALUE
ОписаниеЗадает значение кнопки, которое будет отправлено на сервер. На сервер отправляется пара «имя=значение», где имя задается параметром name тега <BUTTON>, а значение - параметром value. Значение может, как совпадать с текстом на кнопке, так быть и самостоятельным. Также параметр value применяется для доступа к данным через скрипты. Синтаксис<button value="значение">...</button>
АргументыЛюбая текстовая строка. Значение по умолчаниюНет. Пример 4. Значение кнопки <!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=windows-1251"> <title>Пример тега BUTTON, параметр value</title> </head> <body> <form action="/test.php"> <p>...</p> <p><button value="значение" name="hidden" type="submit">Отправить форму</button></p> </form> </body> </html> | |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
| Просмотров: 268 | Теги: | Рейтинг: 0.0/0 | |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
| Всего комментариев: 0 | |