如何用Bootstrap制作輸入框組
2022-02-23
工具/材料
Sublime Text
操作方法
- 01
首先用Sublime Text工具新建HTML5頁面，導(dǎo)入bootstrap的樣式文件和腳本文件，如下圖所示
- 02
然后我們調(diào)用input-group樣式來讓輸入框組中的元素在同一行，如下圖所示
- 03
當(dāng)然input-group-addon不只可以放在輸入框的前面，也可以放在輸入框的后面，如下圖所示
- 04
也可以通過input-group-lg樣式讓輸入框組中的元素變大，還有其他的一些控制大小的樣式你可以查一下API
- 05
接下來你也可以在input前面加入復(fù)選框，如下圖所示，將復(fù)選框放在input-group-addon里即可
- 06
還可以在輸入框組中定義button按鈕，如下圖所示，按鈕可以通過btn-default,btn-primary等來定義樣式
- 07
最后也可以在輸入框的前面加入下拉菜單，這種也是比較常用的功能，如下圖所示
詞條內(nèi)容僅供參考，如果您需要解決具體問題
（尤其在法律、醫(yī)學(xué)等領(lǐng)域），建議您咨詢相關(guān)領(lǐng)域?qū)I(yè)人士。