Method of making a form of consolidation

Bootstrap create forms

bootstrap form is very powerful, you can create different forms of input boxes, and radio buttons checkbox.

<form role="form">
  <div class="form-group">
    <label for="name">名称</label>
    <input type="text" class="form-control" id="name" placeholder="请输入名称">
  </div>
  <div class="form-group">
    <label for="inputfile " > file input </ label> 
    <INPUT type = " File " ID = " inputfile " > 
    <P class = " Help-Block " > Here is an example of block-level help text. </ P> 
  </ div> 
  < div class = " the CheckBox " > 
    <label> 
      <the INPUT of the type = " the CheckBox " > Please tick
     </ label> 
  </ div> 
  <the Button of the type = " the Submit " class="btn btn-default">提交</button>
</form>

 

 

 

Input box (Input)

type may be added to the type: text, password, datetime, datetime -local, date, month, time, week, number, email, url, search, tel  , and  color

<input type="text" class="form-control" placeholder="文本输入">

Text box Textarea

You can be multi-line input

 

Checkbox (Checkbox) and a single box (Radio)

Check boxes and radio buttons are used to allow the user to select from a range of options pre-settings.

  • When creating a form, if you want the user to choose from several options list, use  the CheckBox . If you restrict the user can select an option, use the  Radio .
  • Using a series of check boxes and radio buttons  .checkbox-inline  or  .radio inline-  class, which controls the display on the same line.

Select the box (Select)

A list can be used to make a choice.

<form role="form">
  <div class="form-group">
    <label for="name">选择列表</label>
    <select class="form-control">
      <option>1</option>
      <option>2</option>
      <option>3</option>
      <option>4</option>
      <option>5</option>
    </select>
</div>
</form>

 

Guess you like

Origin www.cnblogs.com/dieyingmanwu/p/12641331.html