' Создание кнопки в HTML | Шнайдер блог

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

Кнопки  — неотъемлемая часть веб-портала. Создаются они при помощи тегов <input> и <button>. Рассмотрим оба варианта.

Тег <input>:

<html>
<head>
 <meta charset="utf-8">
 <title>Кнопка</title>
</head>
<body>
 <form>
  <p><input type="button" value="Кнопка"></p>
 </form>
</body>
</html>

Как отображается кнопка в браузере:

Тег <button>:

<html>
<head>
 <meta charset="utf-8">
 <title>Кнопка</title>
</head>
<body>
 <form>
  <p><button>Загрузить</button>
  <button>
   <img src="images/edit_find.png" alt="" style="vertical-align:middle">
  Кнопка поиска
  </button></p>
 </form>
</body>
</html>

Как отображается в браузере:

Как вы видите, тег <button> отличается более обширными настройками. Так, на кнопку можно поместить любой элемент HTML, в том числе и изображение, как показано в нашем примере. Между тем, если вы хотите сделать действительно оригинальную необычныю кнопку для сайта, вам не обойтись без CSS.


Категории


Хостинг сайтов

Популярное в категории