Membuat Template Dengan Bootstrap Part 4 : Membuat From

 Membuat Form Dengan Bootstrap

Ada tiga jenis desain layout form yang dapat dibuat dengan bootstrap, yaitu vertical form (basic / default), inline form dan horizontal form.

• From Dengan model Vertical Adalah From Default di Bootstrap
• From Dengan model inline Adalah From label atau From inputnya terletak
• From Dengan model Horizontal Adalah From yang memiliki bentuk Horizontal Artinya Posisi label dan Inputanya terletak secara Horizontal

Scriptnya :

 <div id="contact" class="container-fluid bg-grey">
  <h2 class="text-center">KONTAK</h2>
  <div class="row">
    <div class="col-sm-5">
      <p>Hubungi kami dan kami akan kembali kepada Anda dalam waktu 24 jam.</p>
      <p><span class="glyphicon glyphicon-map-marker"></span> Jl. Imam Bonjol No. 7 Pandean, Kec. Mejayan
      Kab. Madiun Kodepos 63153 Jawa Timur</p>
      <p><span class="glyphicon glyphicon-phone"></span> (0351) 388-490</p>
      <p><span class="glyphicon glyphicon-envelope"></span> smkgreen@smkn1mejayan.sch.id</p>
    </div>
    <div class="col-sm-7 slideanim">
      <div class="row">
        <div class="col-sm-6 form-group">
          <input class="form-control" id="name" name="name" placeholder="Nama" type="text" required>
        </div>
        <div class="col-sm-6 form-group">
          <input class="form-control" id="email" name="email" placeholder="Email" type="email" required>
        </div>
      </div>
      <textarea class="form-control" id="comments" name="comments" placeholder="Komentar" rows="5"></textarea><br>
      <div class="row">
        <div class="col-sm-12 form-group">
          <button class="btn btn-default pull-right" type="submit">Kirim</button>
        </div>
      </div>
    </div>
  </div>
</div>