如何增加html文本框的高度

如何增加文本框的高度？（以及它的字體大小）如何增加html文本框的高度

2009-07-20 mrblah

你不應該對css使用顯式的pt或px度量值，你應該總是使用ems來提高可訪問性。 – 2009-07-20 11:04:49

我有同樣的問題，高度不起作用:(http://codepen.io/leongaban/pen/Eknsc這是因爲搜索，我明天會發佈一個新問題 – 2013-06-20 04:46:01

我假設你提出的問題是你想在頁面渲染後改變大小？

在Javascript中，你可以操縱DOM CSS properties，例如：

document.getElementById('textboxid').style.height="200px"; 
document.getElementById('textboxid').style.fontSize="14pt";

如果你只是想指定高度和字體大小，使用CSS或樣式屬性，例如

//in your CSS file or <style> tag 
#textboxid 
{ 
    height:200px; 
    font-size:14pt; 
} 

<!--in your HTML--> 
<input id="textboxid" ...>

或者

<input style="height:200px;font-size:14pt;" .....>

2009-07-20 10:48:53

不要height和font-size CSS屬性爲你工作？

2009-07-20 10:49:27 Cerebrus

我有同樣的問題http：///codepen.io/leongaban/pen/Eknsc – 2013-06-20 04:44:44

使用CSS：

<html> 
<head> 
<style> 
.Large 
{ 
    font-size: 16pt; 
    height: 50px; 
} 
</style> 
<body> 
<input type="text" class="Large"> 
</body> 
</html>

2009-07-20 10:51:23 James

你爲什麼使用pt？ – inspite 2009-07-20 11:13:57

增加上的文本框的字體大小通常會自動擴大其規模。

<input type="text" style="font-size:16pt;">

如果你想設置一個不與字體大小成正比的高度，我會建議使用類似下面的東西。這樣可以防止像IE這樣的瀏覽器在頂部顯示文本而不是垂直居中。

.form-text{ 
    padding:15px 0; 
}

2009-07-20 10:51:30 Sam152

好點，由於我假設他想要設置這兩個問題，但如果只是增加文本框的大小以適應大文本，那麼這將是理想的解決方案。 – James 2009-07-20 10:55:14

<input type="text" style="font-size:xxpt;height:xxpx">

只需更換「XX」與任何值你的願望。

2009-07-21 08:58:11 user

請注意，如果您想要多行文本框，則必須使用<textarea>而不是<input type="text">。

2009-07-21 09:01:36

隨着內嵌樣式：

<input type="text" style="font-size: 18pt; height: 40px; width:280px; ">

或分開的CSS：

HTML：

<input type="text" id="txtbox">

CSS：

#txtbox { 
    font-size: 18pt; 
    height: 42px; 
    width : 300px; 
}

2015-09-09 05:32:04

如果你想多行考慮這個問題：

<textarea rows="2"></textarea>

根據需要指定行。

2017-06-11 01:44:48

回答