为什么要为HTML表单使用定义列表(DL,DD,DT)标记而不是表格?

内容来源于 Stack Overflow,并遵循CC BY-SA 3.0许可协议进行翻译与使用

  • 回答 (2)
  • 关注 (0)
  • 查看 (46)

我最近遇到了几个例子,这些例子是这样的:

<dl>
  <dt>Full Name:</dt>
  <dd><input type="text" name="fullname"></dd>
  <dt>Email Address:</dt>
  <dd><input type="text" name="email"></dd>
</dl>

用于做HTML表单。这是为什么?与使用table相比,有什么优势?

提问于
用户回答回答于

应该使用与表单相关的属性,而不是定义列表。

<form>
  <label for="fullname">Full Name:</label>
  <input type="text" name="fullname" id="fullname">
  <label for="email">Email Address:</label>
  <input type="text" name="email" id="email">
</form>

<label>标签中的“for”属性应引用<input>标签的“id”属性。请注意,当标签与字段相关联时,单击标签将关联相关字段。

也可以使用像<fieldset>这样的标签将表格的各个部分聚合在一起,并使用<legend>标记字段集。

用户回答回答于

我标记我的形式是这样的:

<form name="LoginForm" action="thispage">
    <fieldset>
        <legend>Form header</legend>
        <ul>
            <li>
                <label for="UserName">Username: </label>
                <input id="UserName" name="UserName" type="text" />
            </li>
            <li>
                <label for="Password">Password: </label>
                <input id="Password" name="Password" type="text" />
            </li>
        </ul>
    </fieldset>
    <fieldset class="buttons">
        <input class="submit" type="submit" value="Login" />
    </fieldset>
</form>

这种方法给我留下了一套易于理解的标签,它包含足够的钩子以多种不同的方式设计表单。

扫码关注云+社区

领取腾讯云代金券