Input Group

將 Input 與其他附加資訊相結合。使用類別名稱為 .input-grp。各種附加輔助資訊如文字、圖示等等,可於 .input-grp 內新增 .input-append 然後置放附加輔助資訊。

@

.00

NTD .00

Option
<div class="input-grp"> <span class="input-append"></span> <input type="text" class="input"> </div>

表單元件

.input-append 除了文字與圖示之外,也可以置入 Radio 與 Checkbox。


<div class="input-grp"> <input type="text" class="input"> <span class="input-btn"> <button class="btn"></button> </span> </div>

按鈕

將 Button 搭配 Input 使用。先添加 .input-btn 後置入 Button 元件。

<div class="input-grp"> <input type="text" class="input"> <span class="input-btn"> <button class="btn"></button> </span> </div>