ionic-framework/e2e/text-input/stacked-labels/main.html

<ion-toolbar><ion-title>Stacked Label Text Input</ion-title></ion-toolbar>


<ion-content>

  <ion-list>

    <ion-input stacked-label>
      <ion-label>Label 1</ion-label>
      <input value="Text 1" type="text">
    </ion-input>

    <ion-input stacked-label>
      <ion-label>Label 2</ion-label>
      <input value="Text 2" type="text">
    </ion-input>

    <ion-input stacked-label>
      <ion-label>Label 3</ion-label>
      <input value="3" type="number">
    </ion-input>

    <ion-input stacked-label>
      <ion-label>Label 4</ion-label>
      <textarea>Textarea 4</textarea>
    </ion-input>

    <ion-input stacked-label>
      <ion-label>Label 5</ion-label>
      <input value="http://url5.com/" type="url">
    </ion-input>

    <ion-input stacked-label>
      <ion-label>Label 6</ion-label>
      <input value="email6@email.com" type="email">
    </ion-input>

    <ion-input stacked-label>
      <ion-label>Label 7</ion-label>
      <textarea>Textarea 7</textarea>
    </ion-input>

    <ion-input stacked-label>
      <ion-label>Label 8</ion-label>
      <input value="Text 8" type="text">
    </ion-input>

    <ion-input stacked-label>
      <ion-label>Label 9</ion-label>
      <input value="9" type="number">
    </ion-input>

    <ion-input stacked-label>
      <ion-label>Label 10</ion-label>
      <textarea>Textarea 10</textarea>
    </ion-input>

  </ion-list>

</ion-content>