如何使用标签内联文本区域，以便文本区域保持其正常流动并环绕标签

Question

我搜索过类似的问题，但 none 似乎解决了这个具体问题，我想做的是完成这样的事情：

Label -------------------
-------------------------
-------------------------

其中 "Label" 是实际标签，“-”代表我的文本区域，我已经尝试了从浮动到内联元素的所有方法，但我就是想不通，有没有没有标签是绝对的，因此在文本区域可滚动时隐藏文本的方法？

Answer 1

我不知道如何在不涉及 JS 的情况下使用 <textarea> 执行此操作，但您始终可以使用 contenteditable

div[contenteditable] {
  border: 2px solid;
  font-size: 1.2em;
  width: 200px;
  height: 200px;
}

[contenteditable]>span {
  color: orange;
}

<div contenteditable>
  <span contenteditable="false">Label:</span>
  Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas vitae rhoncus felis, vel auctor tortor. Nunc porttitor arcu eget luctus feugiat.
</div>

仍有改进的空间，当然需要管理。

如何使用标签内联文本区域，以便文本区域保持其正常流动并环绕标签

How to inline a textarea with a label so that the textarea keeps its normal flow and wraps around the label

html

css

textarea