Создание кнопок в html

Умение создавать формы это хорошо, но так-же не надо забывать и про создание кнопок в html, ибо без них все формы окажутся бесполезными, по крайней мере без кнопки "отправить" уж точно.

На изображении ниже вы видите две самые ходовые и часто применяемые виды кнопок, но на самом деле их четыре разновидностей, в этом посте я постараюсь детально разложить их все по полочкам.

Создание кнопок в html, а именно для форм, необходимо чтобы все данные которые были введены в формы, были благополучно отправлены в обработчик который указывается в самом теге формы в атрибуте "action", для этого служит кнопка "отправить", а кнопка с названием "очистить", служит для того, что-бы очистить сразу все формы от введённой в неё информации.

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

Создание кнопок в html мы начнём с основной их разновидностью для отправки данных.

<p><input type="submit" name="submit" value="Отправить"></p>

type="submit" - Говорит о том что мы создали кнопку (submit)

name="submit" - Это имя кнопки

value="Отправить" - Всё что написано в этом параметре, будет отображаться на вашей кнопке, у меня вот например на сайте, ниже где комментарии, такая-же кнопка называется "Запостить"

Теперь посмотрим на то, как создаётся кнопка очистки:

<p><input type="reset" name="reset" value="Сброс"></p>

Единственное различие у этой кнопки как вы уже заметили это (type="reset")

Теперь давайте изучим как создаётся кнопка в виде картинки:

<p><input type="image" src="images/knopka.phg" name="imges"></p>

type="image" - Надеюсь этот атрибут мне объяснять уже не нужно.

src="images/knopka.phg" - В этом атрибуте мы указываем полный путь до нашей кнопки картинки.

name="imges" - Тут задаём любое имя нашей кнопке.

Осталось изучить последний тип обычной кнопки:

<p><input type="battom" value="Кнопка" name="battom"></p>

Ну вот, мы прошли создание кнопок в html, во всех возможных проявлениях.