Html 将标签放置在文本区域的顶部

我想将标签按此图片所示的格式放置在html区域的顶部。我使用的是垂直对齐属性，但标签位于文本区域的左侧

我得到的当前格式是这样的

正在使用的css代码是

textarea { vertical-align: top; }

请告诉我如何按照图像中给出的格式定位标签。

请尝试以下代码：-

<label for="title">Title : </label>
<br/>
<textarea rows="5" id="title" name="title"></textarea>

标题：

运行。

CSS:

HTML:

标题：

---

有很多方法可以满足您的需求，但对于您提供的代码片段来说，这就足够了。

有一个名为字段集的标签，可以满足您的需求

<fieldset>
  <legend>Lable</legend>
  Data in the Box comes Here...!!
 </fieldset>

拉布勒
框中的数据在此显示。。。！！

希望这就是你想要的

---

下面是演示

语义方法是使用DL和DT

<form>
    <dl>
        <dt><label for="title">Title : </label></dt>
        <dt><textarea rows="5" id="title" name="title"></textarea></dt>
    </dl>
</form>

FORM DL {
    display: inline-block;
    vertical-align: top;
}

标题：
表格DL{
显示：内联块；
垂直对齐：顶部；
}

尝试发布的答案。是否正确？表单可以归类为“定义列表”？这是一种设计选择。但重要的一点是在内联的周围有块级元素。很好的解决方案——我不知道为什么我以前从未想到过。哇，谢谢@Sree ram。这太神奇了，我怎么这么长时间都不知道这件事！

<fieldset>
  <legend>Lable</legend>
  Data in the Box comes Here...!!
 </fieldset>

<form>
    <dl>
        <dt><label for="title">Title : </label></dt>
        <dt><textarea rows="5" id="title" name="title"></textarea></dt>
    </dl>
</form>

FORM DL {
    display: inline-block;
    vertical-align: top;
}