Ввод текста: всплывающие названия полей для ввода

Незакрепленные названия полей схожи с фиксированными, за исключением включающейся анимации при вводе текста – название поля перемещается выше вводимого текста. Для каждого объекта (поле с названием и место для ввода текста) следует задать item-floating-label, а input-label для места, отведенного под ввод текста.

Пример также показывает использование атрибута placeholder для подсказки пользователям, какую информацию предполагается ввести.

<div class="list">
  <label class="item item-input item-floating-label">
    <span class="input-label">First Name</span>
    <input type="text" placeholder="First Name">
  </label>
  <label class="item item-input item-floating-label">
    <span class="input-label">Last Name</span>
    <input type="text" placeholder="Last Name">
  </label>
  <label class="item item-input item-floating-label">
    <span class="input-label">Email</span>
    <input type="text" placeholder="Email">
  </label>
</div>