Amount (in dollars)
    
      $
      
      .00
    
  
  Transfer cash

水平排列的表單

通過為表單添加 .form-horizontal 類，并聯(lián)合使用 Bootstrap 預置的柵格類，可以將 label 標簽和控件組水平并排布局。這樣做將改變 .form-group 的行為，使其表現(xiàn)為柵格系統(tǒng)中的行（row），因此就無需再額外添加 .row 了。

  
    Email
    
      
    
  
  
    Password
    
      
    
  
  
    
      
        
           Remember me
        
      
    
  
  
    
      Sign in
    
  

被支持的控件

表單布局實例中展示了其所支持的標準表單控件。

輸入框

包括大部分表單控件、文本輸入域控件，還支持所有 HTML5 類型的輸入控件： text、password、datetime、datetime-local、date、month、time、week、number、email、url、search、tel 和 color。

必須添加類型聲明

只有正確設置了 type 屬性的輸入控件才能被賦予正確的樣式。

輸入控件組

如需在文本輸入域 前面或后面添加文本內(nèi)容或按鈕控件，請參考輸入控件組。

文本域

支持多行文本的表單控件?？筛鶕?jù)需要改變 rows 屬性。

多選和單選框

多選框（checkbox）用于選擇列表中的一個或多個選項，而單選框（radio）用于從多個選項中只選擇一個。

Disabled checkboxes and radios are supported, but to provide a "not-allowed" cursor on hover of the parent , you'll need to add the .disabled class to the parent .radio, .radio-inline, .checkbox, or .checkbox-inline.

  
    
    Option one is this and that—be sure to include why it's great
  


  
    
    Option two is disabled
  



  
    
    Option one is this and that—be sure to include why it's great
  


  
    
    Option two can be something else and selecting it will deselect option one
  


  
    
    Option three is disabled
  

內(nèi)聯(lián)單選和多選框

通過將 .checkbox-inline 或 .radio-inline 類應用到一系列的多選框（checkbox）或單選框（radio）控件上，可以使這些控件排列在一行。

   1


   2


   3



   1


   2


   3

不帶label文本的Checkbox 和 radio

如果需要 內(nèi)沒有文字，輸入框（input）正是你所期望的。 目前只適用于非內(nèi)聯(lián)的 checkbox 和 radio。 請記住，仍然需要為使用輔助技術(shù)的用戶提供某種形式的 label（例如，使用 aria-label)

到此，相信大家對“了解Bootstrap中的表單控件”有了更深的了解，不妨來實際操作一番吧！這里是創(chuàng)新互聯(lián)網(wǎng)站，更多相關(guān)內(nèi)容可以進入相關(guān)頻道進行查詢，關(guān)注我們，繼續(xù)學習！