Question

我有这个：

<form method="post" accept-charset="UTF-8" action="#" style="margin-left:130px;">

    <input type="text" style="color:black;height:150px;width:325px;line-height: normal !important;display:block;" >

</form>

很简单。如果输入文本在mdll中，我希望文本将在顶部显示。

行高：正常！重要;不工作。

它在IE上工作得很好，但是在firefox和chrome中，文本在输入的中间显示。

我该怎么办？

Answer 1

每当您想要更多空间时，请使用<textarea>标记而不是<input type="text">标记。使用内部或外部css，因为在内部使用css规则对于多个相同类型的标记是一个非常糟糕的主意。

Check it how to use it 
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Untitled Document</title>
<style>
   textarea{
   -moz-box-sizing: border-box;
    font-size: 0.857143rem;
    line-height: 1.71429;
    padding: 0.714286rem;
    width: 325px;
    height:150px;
   }
</style>
</head>

<body>
<form method="post" accept-charset="UTF-8" action="#" style="margin-left:130px;">

   <textarea id="comment" aria-required="true" rows="8" cols="45" name="comment"></textarea>

</form>
</body>
</html>

Answer 2

HTML：

<input type="text" class="input-lg"/>

的CSS：

.input-lg {

height: 45px;

padding: 10px 16px;

font-size: 18px;

line-height: 1.33;

border-radius: 6px;
}

HTML标记输入文本行高不起作用

2 个答案: