如何让文本显示在顶部而不是侧面？

Question

我有一个定义列表，我希望文本描述保持在文本框之上。然而，文本位于框的左侧。这是html。

<dl>
  <dt>
    <label>Phone Number</label>
  </dt>
  <dd>
    <input name="phone" type="text"/>
  </dd>
</dl>

这是css。

dl {font:normal 12px/15px Arial; position: relative; width: 350px;}
dt {clear: both; float:left; width: 130px; padding: 4px 0 2px 0; text-align: left;}
dd {float: left; width: 200px; margin: 0 0 8px 0; padding-left: 6px;}

Answer 1

删除所有float:left;规则。您描述的是默认行为。

Answer 2

尝试将display：block添加到dt和dd定义中（尚未对此进行测试，只是一个想法）。