Question

我已经建立了这样的输入表单：

<form name='inputform' id='inputform'>

    <div class="center_text_grid flex-item mktg_text EMail_Pwd">

    <input type="text" class="signup_join" autofocus placeholder="Your email address" id="email_field" name="email_field" style="width:75%;" required></div>

    <div class="center_text_grid flex-item mktg_text EMail_Pwd">

    <input type="text" class="signup_join" autofocus placeholder="First Name (optional)" id="name_field" name="name1_field" style="width:75%;"></div>

    <div class="center_text_grid flex-item mktg_text EMail_Pwd">
    <input type="text" class="signup_join" autofocus placeholder="Last Name (optional)" id="name_field" name="name2_field" style="width:75%;"></div>

    <div class="center_text_grid flex-item mktg_text EMail_Pwd">
    <input type="comments" class="signup_join" autofocus placeholder="Comments (optional)" name="comments" style="width:75%;"></div>

</form>

最后一个输入框用于自由形式的文本注释，但其行为类似于电子邮件输入框，默认情况下，光标位于中心，并且文本不会自动换行。我需要一个具有与其他三个输入相同的大小和圆角边缘的框，但是文本像普通输入框一样环绕。换句话说，我正在寻找一个简单的自由形式文本框作为表单输入框。

这是四个类的css代码：

.center_text_grid {
    display: grid;
    grid-column: 5 / 12;
    grid-row: 20 / 20;
    display: block;
    overflow: auto;
    align-items: center;
    justify-items: center;
}

.flex-item {
  display: flex;
  width: 70%;
  flex-direction: row;
  align-items: center;
  justify-content: center;
}

.mktg_text{
    font-family: CamphorW01-Thin, sans-serif;
    font-size: 13pt;
    color: rgb(175,222,162);
    line-height: 1.5;
}

.EMail_Pwd{
    grid-column: 8 / 14;
    font-family: CamphorW01-Thin, sans-serif;
    font-size: 14pt;
}

我在自由格式文本框中使用所有相同的类。我为自由格式文本框尝试了新类，但仍然没有成功。一个简单的问题是如何根据上述表单代码创建自由格式的文本输入框？

感谢任何想法。

Answer 1

<input type="comments" /> 评论不是有效的输入类型。使用<textarea>。

自由文本格式输入框

1 个答案: