html - 文本框中的起始位置 (html/css)

Question

我正在尝试创建一个文本框，以便用户可以在其中输入一本书的章节。

它从方框的中间开始打字。我该如何解决？

.TextBox {
  width: 500px;
  height: 50px;
  background: #cccccc;
  margin-left: auto;
  margin-right: auto;
}
.TextBox > h1 {
  font-family: 'Consolas';
  text-align: center;
  padding-top: 10px;
}
#textbox {
  width: 500px;
  height: 200px;
}

<div class="container">
  <div class="TextBox">
    <h1> Enter text here </h1>
    <form>
      <input type="text" id="textbox">
    </form>

  </div>
</div>

Answer 1

使用 <textarea>如果我没理解错的话，将它对齐到中心。随着col属性你可以定义文本区域的宽度和 row你可以定义文本区域的高度

.TextBox {
  width: 500px;
  height: 50px;
  background: #cccccc;
  margin-left: auto;
  margin-right: auto;
}
.TextBox > h1 {
  font-family: 'Consolas';
  text-align: center;
  padding-top: 10px;
}
#textbox {
  width: 500px;
  height: 200px;
  text-align:center;
}

<div class="container">
  <div class="TextBox">
    <h1> Enter text here </h1>
    <form>
      <textarea cols="80" rows="10" id="textbox" type="text" name="textbox">Lorem ipsum
</textarea>
    </form>

  </div>
</div>