Question

我不知道你在哪里编辑我的问题的代码所以我把它们都放了（抱歉，如果这让任何人感到困惑）

在右上角有两个文本框，但我不知道如何让它们更高。你能帮我吗？

以下是到目前为止我网站的链接：http://jsfiddle.net/xiiJaMiiE/4UUgg/1/embedded/result/

#signin 
{
position:absolute;
min-width:22%;
height 20%;
top:0%;
right:0%;
z-index:10;
background-color:#CCC;
border: 1px solid grey;

}
#signin input {
background-color:#FFF  
}

很抱歉感到痛苦，但我该如何添加文字呢？但当用户点击框中消失了？谢谢你的帮助！

Answer 1

根据this回答，这就是它所说的：

在Javascript中，您可以操作DOM CSS属性，例如：

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;" .....>

Answer 2

如果你想让它们变得更大，比如多行输入，你可能想要使用textarea标签而不是输入标签。这允许您在textarea中放入所需的行数和列数，而不会弄乱css（例如<textarea rows="2" cols="25"></textarea>）。

默认情况下，文本区域可以调整大小。如果要禁用它，只需使用resize css规则：

#signin textarea {
    resize: none;
}

关于用户点击时消失的默认文字问题的简单解决方案是使用占位符属性。这也适用于<input>标记。

<textarea rows="2" cols="25" placeholder="This is the default text"></textarea>

当用户输入信息而不是点击时，此文本将消失，但这是此类事情的常见功能。

Answer 3

这样做：

#signin input {
 background-color:#FFF;
 min-height:200px;

}

Answer 4

试试这个：

#signin input {
    background-color:#FFF;
    height: 1.5em;
    /* or */
    line-height: 1.5em;
}

Answer 5

有许多选项可以改变输入框的高度。填充，字体大小，高度都会这样做。这些的不同组合产生具有不同风格的更高输入盒。我建议只更改font-size（和外观的font-family）并添加一些填充，使其更高，也更有吸引力。我将举例说明这三种风格：

#signin input {
font-size:20px;
}

OR

#signin input {
padding:10px;
}

OR

#signin input {
height:24px;
}

这是我推荐的三者的组合：

#signin input {
font-size:20px;font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; font-weight: 300;
padding:10px;
}

Answer 6

.textbox {
    height: 40px;
}

<div id=signin>  
    <input type="text" class="textbox" size="25%" height="50"/></br>
<input type="text" class="textbox" size="25%" height="50"/>

增大字体大小并添加高度（或输入框的行高）我不建议在HTML中添加那些大小和高度属性，因为CSS可以处理这些属性。我创建了一个可以用于多个输入框的类文本框

如何在HTML / CSS中使文本框更大？

6 个答案: