Атрибут placeholder

Выводит текст внутри поля формы, который исчезает при получении фокуса или при наборе текста. Обычно отображается серым цветом.

Синтаксис

<input placeholder="<текст>">

Значения

Текстовая строка. Если внутри строки предполагается пробел, её необходимо брать в двойные или одинарные кавычки.

Значение по умолчанию

Нет.

Пример

<!DOCTYPE html>
<html>
 <head>
  <meta charset="utf-8">
  <title>input, атрибут placeholder</title>
 </head>
 <body> 
  <form action="handler.php">
   <p><input type=search placeholder="Введите текст для поиска">
   <input type="submit" value="Искать"></p>
  </form> 
 </body>
</html>

Результат примера показан на рис. 1.

Текст внутри поля для поиска

Рис. 1. Текст внутри поля для поиска

Браузеры ?

Браузеры

В таблице браузеров применяются следующие обозначения.

  •  — элемент полностью поддерживается браузером;
  •  — элемент браузером не воспринимается и игнорируется;
  •  — при работе возможно появление различных ошибок, либо элемент поддерживается с оговорками.

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

Практика

Автор и редакторы

Автор: Влад Мержевич
Последнее изменение: 30.08.2017
Редакторы: Влад Мержевич
Курс по вёрстке сайта на CSS Grid