Bootstrap 3 - 減少文本和字段大小

我在Bootstrap 3中創建表單。希望將它們周圍的輸入字段和標籤顯示爲比默認情況下提供的引導程序更小。Bootstrap 3 - 減少文本和字段大小

爲了做到這一點，我已經創建了幾個CSS類的

.input-field { 
    height: 20px 
} 

.label-size { 
    font-size: 10px; 
    line-height: 1.2; 
}

然而，這已經搞砸了複選框對齊。每個複選框的標籤不會與複選框正確對齊，而且字段（標籤）的標籤顯示錯誤。

我如何糾正呢？

2017-06-15 kayasa

這似乎沒有一個具體的解決方案。您將需要分別調整所有元素的邊距填充和線高以獲得所需的結果。 – viCky

在你的情況下，添加頂部：3px;到你的輸入，或者你也可以增加行高：2.2;爲您的.label大小類 – Archana

您是否指的是輸入字段的CSS類？我添加了頂部：3px到輸入字段的CSS類，但它沒有任何影響。 – kayasa

如果您想縮小標籤的大小，只需使用small標籤環繞文本即可。

<small><label class="col-xs-4 label-size">checkboxes</label></small>

您也可以在標籤標籤內使用它。

<label><input type="checkbox" id="chk1"><small> chk1</small></label>

2017-06-15 11:54:24 Laiman

回答