Как сделать кнопку в html из любого элемента на сайте

Многим известно, что для создания простой кнопки на html достаточно использовать тэг button или воспользоваться формой. Но как сделать кнопку абсолютно из любого элемента на сайте. Один из способов представлен в данной статье. 

Он заключается в использовании события на jаvascript - onclick. Допустим, у нас имеется блок div с текстом 

<div>Текст</div> 

Дописываем к этому блоку событие onclick, в нем указываем команду для отображения сплывающего сообщения. 

<div onclick=”alert(‘Кнопка нажата’)”>Текст</div> 

Таким образом обычный текст в теге html на сайте превратился в кнопку. Но такой вариант будет несколько смущать пользователя, так как ему практичеси невозможно догадаться, что текст это кнопка. Поэтому немного оформим ее при помощи css.  

<div onclick=”alert(‘Кнопка нажата’)” style=”cursor:pointer;”>Текст</div> 

Параметр cursor отвечает за изменение курсора мыши при наведении на объект.  

<div onclick="alert('Кнопка нажата')" style="cursor:pointer;border-width:1px;border-style:solid;background-color:gray;width:100px;text-align:center;color:#ffffff;">Текст</div> 

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

Как было указано ранее, кнопку таким способом можно сделать из любого элемента на html странице.