Найти в Дзене
<!Веселый HTML>

Уроки HTML5: строчно-блочные элементы (Часть третья)

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

Уроки HTML5
Уроки HTML5

Элемент <button> выполняет роль кнопки на веб-странице. При нажатии кнопки происходит какое-либо действие. Эффект схож с <input type = "button">. Некоторые даже указывают аналогичный тип кнопки при написании тега. На кнопки "вешается" обработчик (программа, описывающая поведение странички при нажатии). Написать обработчики я вас научу чуть позже, пока вам с разметкой надо разобраться :) Хотя, возможно статью будут читать матерые "разрабы", которые этих обработчиков уже за тысячу наклепали.

Почему именно <button>? Элемент более современный, адаптивный. В некоторых фреймворках (типа Bootstrap) есть отличные готовые решения для кастомизации. Но вы и сами можете креативно кастомизировать кнопку в том же "фотошопе". Для этого понадобится немного смекалки и умения рисовать прямоугольники.

Вот такую кнопку на сайт вешаете, бабуля какая-нибудь сайт открывает, а при нажатии появляется анимация выключения компьютера. Бабуля будет искать внуков, чтобы включили включенный ПК :D
Вот такую кнопку на сайт вешаете, бабуля какая-нибудь сайт открывает, а при нажатии появляется анимация выключения компьютера. Бабуля будет искать внуков, чтобы включили включенный ПК :D

В следующей статье рассмотрим еще больше полезных элементов!