Question

我看到了一些代码，html表单代码如下所示：

<form name="form1" method="post" action="action.php">
    <label for="name"> Name: <input type="text" name="name">
    <label for="email">Email: <input type="text" name="email">
</form>

“名称”的形式是什么？（ - ＆gt; form1）

标签标签是什么？（我从不使用它，因此，输入代码时可能会出错）

Answer 1

标签是输入字段旁边的文字 - 它们看起来与普通文字没有任何不同，但是：

点击它们会将焦点放在字段上
屏幕阅读器会将它们作为对应字段的说明进行阅读。

它们对CSS也很有用 - 通过使用标签，您可以轻松地设置字段标签的样式，而与其他页面元素无关。

form name属性可以更轻松地从JavaScript引用表单（虽然现在您使用id）。

Answer 2

Label是一个标签，它将某个文本与表单元素相关联。这是显示每个输入框所用内容的推荐方式 - 屏幕阅读器和其他辅助功能软件将能够使用此元素告诉用户输入框的用途。它的样式可以与页面上的任何其他元素相同，甚至不必在输入旁边 - 只要名称相同，它就可以工作。请注意，正确的格式应该是

<label for="name">Name:</label><input type="text" name="name" />
<label for="email">Email:</label><input type="text" name="email" />

有关label元素的更多信息，请访问http://www.w3.org/TR/html401/interact/forms.html#h-17.9 - 该页面包含大量有关HTML表单的信息。

表单元素的name属性可用于从javascript和css访问不同的表单，但不必包含它。根据{{3}}，它仅用于向后兼容 - 建议您改为使用 id 属性（或者也可以）。

Answer 3

Label将“Name：”字符串语义连接到由for属性指定的相应输入字段。请参阅w3c html documentation。

中的详情

此外，当用户点击标签时，会聚焦相应的输入字段 - 这在形式可用性方面很重要。

Answer 4

表单名称是唯一标识此表单的，因此您可以在JavaScript中编写脚本时引用它。您也可以使用“id”属性，它没有任何区别。

标签元素是为了实用性而不会与普通文本进行任何不同的渲染，但如果使用相关输入的“id”属性填充“for”属性，则这些属性将绑定在一起，以便用户可以单击标签文本，它将专注于相应的输入。

值得注意的是，您在问题中使用的标签代码不正确，因为您需要在要用于标签的文本后关闭标签代码。

<label for="name">Name:</label><input id="name" type="text" name="name" />

这些HTML表单字段是什么？

4 个答案: