-
在制作表單時,不免要做表單驗證。同樣也需要提供驗證狀態樣式,在Bootstrap框架中同樣提供這幾種效果。 1、.has-warning:警告狀態(黃色) 2、.has-error:錯誤狀態(紅色) 3、.has-success:成功狀態(綠色) 使用的時候只需要在form-group容器上對應添加狀態類名。 注意是在容器上添加查看全部
-
Bootstrap框架的表單控件的禁用狀態和普通的表單禁用狀態實現方法是一樣的,在相應的表單控件上添加屬性“disabled”。記住是屬性喲查看全部
-
如果表單使用了類名“form-horizontal”,其中“form-group”就相當于網格系統中的“row”。換句話說,如果沒有這樣做,要通過網格系統來控制表單控件寬度,就需要這樣使用:用row盒子包起來查看全部
-
從上面的源碼中不難發現,不管是“input-sm”還是“input-lg”僅對控件高度做了處理。但往往很多時候,我們需要控件寬度也要做一定的變化處理。這個時候就要借住Bootstrap框架的網格系統。所以你要控制表單寬度,可以像下面這樣使用:查看全部
-
前面看到的表單控件都正常的大小??梢酝ㄟ^設置控件的height,line-height,padding和font-size等屬性來實現控件的高度設置。不過Bootstrap框架還提供了兩個不同的類名,用來控制表單控件的高度。這兩個類名是: 1、input-sm:讓控件比正常大小更小 2、input-lg:讓控件比正常大小更大查看全部
-
在Bootstrap框架中的按鈕都是采用<button>來實現查看全部
-
1、如果checkbox需要水平排列,只需要在label標簽上添加類名“checkbox-inline” 2、如果radio需要水平排列,只需要在label標簽上添加類名“radio-inline”查看全部
-
1、不管是checkbox還是radio都使用label包起來了 2、checkbox連同label標簽放置在一個名為“.checkbox”的容器內 3、radio連同label標簽放置在一個名為“.radio”的容器內 在Bootstrap框架中,主要借助“.checkbox”和“.radio”樣式,來處理復選框、單選按鈕與標簽的對齊方式。查看全部
-
文本域和原始使用方法一樣,設置rows可定義其高度,設置cols可以設置其寬度。但如果textarea元素中添加了類名“form-control”類名,則無需設置cols屬性。因為Bootstrap框架中的“form-control”樣式的表單控件寬度為100%或auto。查看全部
-
表單控件(下拉選擇框select) Bootstrap框架中的下拉選擇框使用和原始的一致,多行選擇設置multiple屬性的值為multiple。Bootstrap框架會為這些元素提供統一的樣式風格查看全部
-
為了讓控件在各種表單風格中樣式不出錯,需要添加類名“form-control查看全部
-
在Bootstrap框架中要實現水平表單效果,必須滿足以下兩個條件: 1、在<form>元素是使用類名“form-horizontal”。 2、配合Bootstrap框架的網格系統。(網格布局會在以后的章節中詳細講解) 在<form>元素上使用類名“form-horizontal”主要有以下幾個作用: 1、設置表單控件padding和margin值。 2、改變“form-group”的表現形式,類似于網格系統的“row”。查看全部
-
當然表單除了這幾個元素之外,還有input、select、textarea等元素,在Bootstrap框架中,通過定制了一個類名`form-control`,也就是說,如果這幾個元素使用了類名“form-control”,將會實現一些設計上的定制效果。 1、寬度變成了100% 2、設置了一個淺灰色(#ccc)的邊框 3、具有4px的圓角 4、設置陰影效果,并且元素得到焦點之時,陰影和邊框效果會有所變化 5、設置了placeholder的顏色為#999查看全部
-
知識補充:定義和用法 fieldset 元素可將表單內的相關元素分組。 <fieldset> 標簽將表單內容的一部分打包,生成一組相關表單的字段。 當一組表單元素放到 <fieldset> 標簽內時,瀏覽器會以特殊方式來顯示它們,它們可能有特殊的邊界、3D 效果,或者甚至可創建一個子表單來處理這些元素。 <fieldset> 標簽沒有必需的或唯一的屬性。 <legend> 標簽為 fieldset 元素定義標題。查看全部
-
表單主要功能是用來與用戶做交流的一個網頁控件,良好的表單設計能夠讓網頁與用戶更好的溝通。表單中常見的元素主要包括:文本輸入框、下拉選擇框、單選按鈕、復選按鈕、文本域和按鈕等。其中每個控件所起的作用都各不相同,而且不同的瀏覽器對表單控件渲染的風格都各有不同查看全部
舉報
0/150
提交
取消