Создание кнопки для сайта используя тег html <button>.
Если перед вами стоит задача сделать кнопку для своего сайта, тогда этот урок вам в помощь.
Для того чтобы на сайте появилась кнопка можно воспользоваться html тегом <button>.
Данный тег имеет расширенные возможности. С его помощью вы можете сделать не просто кнопку, а КНОПКУ.
Объясняю.
Тег <button> позволяет применять к себе различные стили CSS. C их помощью вы можете менять фон, добавлять границу, изменять шрифт. И более того, он позволяет в качестве кнопки использовать изображение. Для этого в него достаточно поместить тег рисунка <img>.
Вот как выглядит данный тег:
А так он выглядит с картинкой внутри:
Выше мы рассмотрели простую кнопку. Но часто возникает необходимость отправлять результат нажатия по кнопке на сервер для дальнейшей обработки. В таком случае тег <botton> помещают в контейнер формы <form>.
Вот так:
<button>название для кнопки</button>
</form>
С тегами разобрались, переходим к параметрам кнопки.
Параметры button
disabled - блокирует кнопку. Она становится недоступной и по ней невозможно нажать.
Пример:
<div><button>Активная кнопка</button></div>
<div><button disabled>Неактивная кнопка</button></div>
</form>
type - определяет тип кнопки. По внешнему виду их не отличить, но по функциям они разные:
- обычная кнопка (button)
- кнопка для подтверждения и отправки данных формы на сервер (submit)
- кнопка для очистки заполненной формы (reset)
Пример:
<form action="file.php">
<div><button type=" button">Кнопка</div>
<div><button type="reset">Очистить </div>
<button type="submit">Отправить </button></p>
</form>
value - этот параметр задает значение кнопки, которое затем отправляется на сервер или обрабатывается с помощью сприптов. Оно может совпадать с названием кнопки, а может и не совпадать. Значение передается на сервер в паре с именем кнопки. Для имени используется параметр name.
Пример:
<div><button value="send" name="hidden" type="submit">Отправить </button></div>
</form>
Такая вот она, кнопка для сайта.
P.S.: Нужна новая газовая плита? Тогда вам сюда - http://viborgazovoipliti.ru. На этом сайте можно прочитать о том, как выбрать газовую плиту, на что, кроме цены, стоит обратить внимание, и где и как ее можно купить.
Сайт: web-lesson.ru
Ключевые теги: кнопка, html, button
