• 智能AI问答!更聪明、更完整、原创作!
  • 一款基于GPT的超级AI机器人,可以回答问题、聊天、创作、写文案!

如何让textarea内的文字垂直居中

发布于 2023-06-15 18:54:48

可以使用 CSS 样式来实现 textarea 内文字的垂直居中,下面给出一种常见的方法:

  1. 为 textarea 设置 display: table-cell; 属性,以使其表现为一个表格单元格;
  2. 为父元素(如包含 textarea 的 div 元素)设置 display: table;height: 100%; 属性,以使其表现为一个表格;
  3. 同时为父元素和 textarea 设置 vertical-align: middle; 属性,以将内部元素垂直居中。

示例代码如下:

HTML:

<div class="container">
  <textarea></textarea>
</div>

CSS:

.container {
  display: table;
  height: 100%;
}

textarea {
  display: table-cell;
  vertical-align: middle;
}

上述代码中,.container 元素被设置为表格,其高度为 100%,.container 内的 textarea 元素被设置为表格单元格,并使用 vertical-align: middle; 垂直居中文本。这样就可以实现 textarea 内文字的垂直居中了。

需要注意的是,这种方法只在 textarea 的高度固定,不随内容高度自适应的情况下有效。如果需要 textarea 的高度随内容高度自适应,需要使用 JavaScript 等方法动态计算高度并设置。

0 条评论

发布
问题

在线
客服