<input>,<textarea>,<select> kutuları için .form-control sınıfını kullanarak satırı olduğu gibi kaplayan ve padding uygulanmış daha güzel görünüm elde edebiliyoruz.
<input type="text" class="form-control">

** bir input kontrolü ve label ‘i barındıran bir div etiketine sınıf olarak .form-group dediğimizde elemanları gruplayarak uygun bir margin değeri vermiş oluyoruz.
** kontrolleri büyüklük olarak .form-control-sm or .form-control-lg sınıfları ile ayarlayabiliriz.
<div class="form-group">
<label for="usr">Name:</label>
<input type="text" class="form-control" id="usr">
</div>

Bir input kontrolünün başına ya da sonuna bir icon ya da bir text eklemek istediğimizde kullanıyoruz.
** Eklemek istediğimiz eleman ile input kontrolünü .form-group içine almalıyız.
** Eğer eklemek istediğimiz nesneyi input kontrolünün başına ekliyorsak .input-group-prepend sonuna ekliyorsak .input-group-append sınıflarını kullanmalıyız.
** input-group’ a vereceğimiz .input-group-sm ve .input-group-lg sınıfları ile büyüklük ayarlaması yapabiliriz.
<div class="input-group">
<div class="input-group-prepend">
<span class="input-group-text">@</span>
</div>
<input type="text" class="form-control" placeholder="Username">
</div>
<div class="input-group input-group-lg">
<input type="text" class="form-control" placeholder="Search">
<div class="input-group-append">
<button class="btn btn-success" type="submit">Go</button>
</div>
</div>

Form Örnekleri
<form action="">
<div class="form-group">
<label for="name">Name</label>
<input type="text" id="name" class="form-control" placeholder="isminizi giriniz">
</div>
<div class="form-group">
<label for="email">Email</label>
<input type="email" id="email" class="form-control" placeholder="email giriniz">
<small class="form-text text-muted">
lütfen mailinizi giriniz.
</small>
</div>
<div class="form-group">
<label for="password">Password</label>
<input type="password" id="password" class="form-control" placeholder="isminizi giriniz">
</div>
<div class="form-group">
<label for="city">City</label>
<select name="city" id="city" class="form-control">
<option value="0">İstanbul</option>
<option value="1">Ankara</option>
<option value="2">İzmir</option>
</select>
</div>
<div class="form-group">
<label for="message">Message</label>
<textarea name="message" id="message" rows="5" class="form-control"></textarea>
</div>
<div class="form-group">
<legends>Hobies</legends>
<div class="form-check">
<label class="form-check-label">
<input type="checkbox">Running
</label>
</div>
<div class="form-check">
<label class="form-check-label">
<input type="checkbox">Football
</label>
</div>
<div class="form-check">
<label class="form-check-label">
<input type="checkbox">Reading
</label>
</div>
</div>
<div class="custom-control custom-checkbox">
<input id="ch" type="checkbox" class="custom-control-input">
<label class="custom-control-label" for="ch">Check</label>
</div>
<div class="custom-control custom-radio">
<input id="rd" type="radio" class="custom-control-input">
<label class="custom-control-label" for="rd">Check</label>
</div>
<div>
<div class="custom-control custom-radio custom-control-inline">
<input id="cr1" type="radio" class="custom-control-input" name="example">
<label class="custom-control-label" for="cr1">Custom Radio 1</label>
</div>
<div class="custom-control custom-radio custom-control-inline">
<input id="cr2" type="radio" class="custom-control-input" name="example">
<label class="custom-control-label" for="cr2">Custom Radio 2</label>
</div>
</div>
</form>

<form action="">
<div class="input-group mt-3">
<input type="text" class="form-control">
<div class="input-group-append">
<span class="input-group-text" id="ig">@gmail.com</span>
</div>
</div>
<div class="input-group mt-3">
<div class="input-group-prepend">
<span class="input-group-text" id="ig">https://</span>
</div>
<input type="text" class="form-control">
</div>
<div class="clearfix mt-4">
<div class="w-50 float-left">
<div class="form-group">
<label for="name">Name</label>
<input type="text" id="name" class="form-control" placeholder="isminizi giriniz">
</div>
</div>
<div class="w-50 float-left pl-2">
<div class="form-group">
<label for="surname">SurName</label>
<input type="text" id="surname" class="form-control" placeholder="soyisminizi giriniz">
</div>
</div>
</div>
</form>
