twitter bootstrap：フォームの内部にフォームグループクラスが必要です

Question

ブートストラップを使うと、フォームグループをそれぞれの入力の周りにラップする必要がありますか？私のフォームはそれを使って、それなしでは完全に省略します）。

それが目的（「最適な間隔」）をフォーマットするため、単純に使用しているように、ブートストラップのドキュメントによると、それはそうと、正しくユーザーの入力を収集するために必要とされていません。http://getbootstrap.com/css/#forms

ここで私はラップかのようなコードが見えるものです一連の入力周りのフォームグループクラス：

<form class="form-horizontal"> 
    <div class="form-group"> 
     <div class="col-sm-6"> 
      <label for="one" class="col-sm-2 control-label">Input One:</label> 
      <div class="col-sm-10"> 
       <input type="number" step="any" class="form-control" id="one"> 
      </div> 
      <label for="two" class="col-sm-2 control-label">Input Two:</label> 
      <div class="col-sm-10"> 
       <input type="number" step="any" class="form-control" id="two"> 
      </div> 
     </div> 
    </div> 
</form> 

また、私はお勧めは、それを使用することを提案しているかいないかどうかを知りたいのです。

Answer 1

ブートストラップの素晴らしい点は、あなた次第です。あなたはそれがスタイリングの目的にのみ使用されるという点で正しいです。 form-controlクラスを使用すると、唯一の要素に次のスタイルを追加します。

.form-control { 
    display: block; 
    width: 100%; 
    height: 34px; 
    padding: 6px 12px; 
    font-size: 14px; 
    line-height: 1.42857143; 
    color: #555; 
    background-color: #fff; 
    background-image: none; 
    border: 1px solid #ccc; 
    border-radius: 4px; 
    -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075); 
    box-shadow: inset 0 1px 1px rgba(0,0,0,.075); 
    -webkit-transition: border-color ease-in-out .15s,-webkit-box-shadow ease-in-out .15s; 
    -o-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s; 
    transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s; 
} 

それは本当にありませんすべては、あなたがより標準的な探してフォームを得るのを助けるです。私の助言は、一貫性のあるやり方で、例えば、グループxの要素を.form-controlクラスで使用するか、個別に行うことですが、絶対に必要な場合を除いては切り詰めたり変更したりしないでください。

希望すると便利です。