2016-04-13 17 views
0

Sadece Bootstrap'i öğrenmeye başladım ve örneğin bu formu bu şekilde tasarladım, bu sütun numaralarının birbirine göre anlamlı olup olmadığını bilmek istiyorum.Sütun numaralarım ve önyükleme genişlikleri için yapmam bile mantıklı mı?

<form class="form-horizontal"> 

    <div class="row"> 
    <div class="col-sm-6"> 
     <div class="form-group"> 
     <div class="col-sm-offset-2 col-sm-10"> 
      <div class="checkbox"> 
      <label> 
       <input type="checkbox"> Website Active 
      </label> 
      </div> 
     </div> 
     </div> 
    </div> 
    </div> 

    <div class="row"> 
    <div class="col-sm-6"> 
     <div class="form-group"> 
     <div class="col-sm-offset-2 col-sm-10"> 
      <label>Display this message when the website is not active</label> 
      <textarea class="form-control" rows="3" id="comment"></textarea> 
     </div> 
     </div> 
    </div> 
    </div> 

</form> 
+0

bir satır, cols "reset" olacaktır 'sütun-sm-6' da tek satıra ve sizin' içine form' koydu. –

+0

teşekkürler, @VincentG, satırın sütunları "sıfırlayacağı" ne anlama geliyor? Ben yeniyim, lütfen sıfırlamanın etkisinin ne olduğunu açıklayabilir misiniz? – Bohn

+0

Bu, bir satır etiketinin varsayılan olarak 12 sütuna sahip olması gerektiği anlamına gelir. "Satır" etiketinizin içinde sadece 6 sütununuz varsa, bu yanlış – Kypaz

cevap

1

See here Ben yorum açıklandığı ne fark: Senin durumunda

, daha doğru bir yapının olabilir:

  <div class="container"> 
       <div class="row"> 
        <form class="form-horizontal"> 
         <div class="col-sm-6"> 
         <div class="form-group"> 
           <div class="checkbox"> 
            <label> 
             <input type="checkbox"> Website Active 
            </label> 
           </div> 
         </div> 
         </div> 
         <div class="col-sm-6"> 
         <div class="form-group"> 
           <label>Display this message when the website is not active</label> 
           <textarea class="form-control" rows="3" id="comment"></textarea> 
         </div> 
         </div> 
        </form> 
       </div> 
      </div> 

Ve etrafında .container veya .container-fluid sınıf eklemek zorunda Sizin .row

Tek bir'te istediğiniz kadar .row olabilirsınıfı. o gruba belki daha iyi yani

See your code on a bootply fiddle

İlgili konular