HTMLメモ(四)bootstrapのformフォーム

2926 ワード

httml 5

フォームは3種類に分かれています
①垂直フォーム(デフォルト)②インラインフォーム③水平フォーム
テキストラベルにcontrol-labelクラス修飾を付けるには、control-labelには右揃え機能があります.
inputラベルにform-controlクラスの修飾を加えて、入力ボックスをよりきれいにします.
form-groupは段落ラベルに相当します.つまり、2つのフォーム要素間の間隔が大きくなり、margin-bottomが増加します.
–
1.垂直または基本フォーム
基本フォームを作成するには、次の手順に従います.
1.親要素にrole="form"を追加
2.ラベルとコントロールをclass="form-group"のある

 。            。 
   3.        、</code>  <code><select/></code>   <code>class="form-control"</code> </p> 
   
  <hr/> 
  <h2 id="2    ">2.    </h2> 
  <blockquote> 
   <p>          ，          ，     ，      ，  <code><form/></code>      <code>class .form-inline</code>。</p> 
   <p>     ，Bootstrap  input、select textarea 100%  ，           ，              。</p> 
   <p>  <code>class="sr-only"</code>            </p> 
  </blockquote> 
  <hr/> 
  <h2 id="3    ">3.    </h2> 
  <h4 id="                                                       ">                   ，            。             ，           </h4> 
  <blockquote> 
   <p>①   <code><form/></code>      class .form-horizontal。</p> 
   <p>②             class .form-group   <code><div>  。 
   <p>③      class .control-label。</p> 
   
 </div> 
</code></p></blockquote></div>
                            </code></p></blockquote></div>
                        </div>
                    </div>
                    <!--PC WAP    -->
                     
                    <script type="text/javascript" src="/views/front/js/chanyan.js"/>
                    <!--    -         -->
                     
                </div>
                <div class="col-md-3">
                    <div class="row" id="ad">
                        <!--    -  1       -->
                        <div id="right-1" class="col-lg-12 col-md-12 col-sm-4 col-xs-4 ad">
                             
                        </div>
                        <!--    -  2       -->
                        <div id="right-2" class="col-lg-12 col-md-12 col-sm-4 col-xs-4 ad">
                             
                        </div>
                        <!--    -  3       -->
                        <div id="right-3" class="col-lg-12 col-md-12 col-sm-4 col-xs-4 ad">
                             
                        </div>
                    </div>
                </div>に く

モバイル端末inputキーボードが落下し、ページが落下していない

MXYNUOJ第4回試験式評価