чилка HTML
 
Динамический HTML

Кнопки и их создание

Кнопку на веб-странице можно создать двумя способами — с помощью тега INPUT и тега BUTTON.

 

1. Добавление кнопки через <INPUT>


Вид на Web-странице:Пишем в документе на HTML:
Добавление кнопки через <INPUT>

В надписи на кнопке можно ставить пробелы в любом количестве, за счет них можно регулировать ее ширину.


 

2. Добавление кнопки через <BUTTON>

В отличие от тега <INPUT>, тег <BUTTON> предлагает расширенные возможности по созданию кнопок.
Например, на подобной кнопке можно размещать любые элементы HTML, в том числе изображения и таблицы.

Вид на Web-странице:Пишем в документе на HTML:
Кнопки созданные с помощью тега <BUTTON>



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


 

Кнопка SUBMIT
Для отправки данных на сервер предназначена специальная кнопка SUBMIT.
Ее вид ничем не отличается от других кнопок, но при нажатии на нее происходит выполнение серверной программы, указанной параметром action тега <FORM>. Эта программа, называемая еще обработчиком формы, получает данные, введенные пользователем в полях формы, производит с ними необходимые манипуляции, после чего возвращает результат в виде HTML-документа. Что именно делает обработчик, зависит от автора сайта, например, подобная технология применяется при создании опросов, форумов, гостевых книг, тестов и многих других вещей.

Синтаксис создания кнопки SUBMIT зависит от используемого тега <INPUT> или <BUTTON>.

<input type="submit" параметры>
<button type="submit">Надпись на кнопке</button>

 

Пример 1. Кнопка для отправки данных на электронную почту

<form method="post" action="mailto:pupkin@mail.ru"> <input type="submit" value="Отправить"> <input type="submit"> </form>

Результат:

Если значение параметра value не указывать, на кнопке автоматически появится надпись «Подача запроса»

 

Кнопка RESET
При нажатии на кнопку RESET, данные формы возвращаются в первоначальное значение.
Как правило, эту кнопку применяют для очистки введенной в полях формы информации. Для больших форм от использования кнопки RESET лучше вообще отказаться, чтобы по ошибке на нее не нажать, ведь тогда придется заполнять форму заново.

Синтаксис создания кнопки RESET.

<input type="reset" параметры>
<button type="reset">Надпись на кнопке</button>

Пример 2. Кнопка для очистки формы

<form action="handler.php"> <p><input type="text" value="Введите текст" size=30 maxlenght=100></p> <p><input type="submit" value="Отправить"><input type="reset" value="Очистить"></p> </form>

После изменения текста и нажатия на кнопку «Очистить», значение поля будет восстановлено и в нем снова появится надпись «Введите текст».

Если надпись на кнопке опустить (не задавать параметр value), на кнопке по умолчанию будет добавлен текст «Сброс» или «Reset».

 

 

 

 

 

Copyright © Москва
Училка HTML: сайт  u4ilka.kcbux.ru