html - 空白/有文本时插入符号在文本区域中的不同位置

Question

我对 <textarea> 有疑问.其中的插入符根据是否为空具有不同的垂直位置:

我的代码:

textarea {
    padding: 0 5px;
    border: none;
    outline: none;
    overflow: hidden;
    height: 30px;
    vertical-align: middle;
    line-height: 26px;
    white-space: pre-wrap;
    outline: 1px solid red;
}

演示: http://jsfiddle.net/oapbghfs/

Answer 1

这使您的文本对齐:

textarea {
    padding: 5px;
    border: none;
    overflow: hidden;
    vertical-align: middle;
    white-space: pre-wrap;
    outline: 1px solid red;
}

这是一个文本区域，默认有两行。

15px 的高度会使其看起来像一条线，然后您可以使用 JS 删除并调整该区域的大小。