CSS中控制input輸入框的高度是很常見的需求,通常情況下我們可以通過設置input標簽的屬性height來控制它的高度,也可以使用CSS樣式表來設置。
input { height: 30px; }
以上CSS代碼可以設置input標簽的高度為30px,從而改變輸入框的高度。需要注意的是,如果輸入框的高度與字體大小不匹配,可能會影響輸入框的美觀程度,因此建議同時設置字體大小。
input { height: 30px; font-size: 16px; }
此外,input標簽還有其他幾個與高度相關的屬性:
1. line-height:設置輸入框內文字的行高,如果不設置,默認與輸入框的高度一致。
input { height: 30px; line-height: 30px; }
2. padding:設置輸入框的內邊距,即輸入框與輸入內容的距離。可以通過設置padding值來控制輸入框高度增加或減少的程度。
input { height: 30px; padding: 5px; }
3. border:設置輸入框的邊框,同樣會影響輸入框的高度。
input { height: 30px; border: 1px solid #ccc; }
總之,在使用CSS控制input輸入框高度時,需要考慮到輸入框內文本的行高、內邊距、邊框等因素,才能保證輸入框的美觀程度。