）的一般重要性发表一些评论。完全可以使用 CSS 和 JavaScript 的组合来使几乎任何 HTML 元素看起来和行为都像表单元素。开发人员通常出于设计原因这样做——某些表单控件很难设置样式。
但是，当您这样做时，您会让自己和用户的生活变得更艰难。浏览器默认提供了一些
例如
语义元素可被屏幕阅读器等辅助技术理解，这些技术将它们的含义传达给无法看到它们的用户。
表单控件和按钮默认情况下可使用键盘访问。在前面的示例中，尝试使用 Tab 和 Shift + Tab（称为“tabbing”）在表单元素之间向前和向后移动。
还要注意，在表单元素之间切换时，聚焦的元素会用蓝色轮廓（称为焦点轮廓）突出显示。这对于键盘用户了解他们在表单中的当前位置是一个重要功能。
如果您不使用正确的语义元素来实现表单，您将不得不重新实现所有这些功能，否则您的表单元素将不会按用户预期的方式运行，因此会显得有问题。这一切都累积起来。
其他控制类型
您可以使用许多其他控制类型在表单中收集数据。让我们看一个稍微复杂一点的示例，然后我们将对其进行探索和解释。
注意：在此示例中，我们假设用户已经注册并登录，因此无需收集姓名和电子邮件等详细信息。
html
Second form
它呈现如下
我们建议您在学习接下来的几节时，在单独的浏览器选项卡中打开此示例，在这些节中，我们将依次查看每种控制类型。为此，请使用您的代码编辑器将代码复制到一个 HTML 文件中，并在浏览器选项卡中打开它。
在继续之前，请在本地副本中尝试不同的表单控件并选择一些值。尝试提交表单，看看 URL 中提交的数据是什么样的。
单选按钮
“选择酒店房型”按钮是使用 控件实现的。这些控件呈现为一组按钮控件，其中每次只能选择一个——您不能同时选择多个。它们以老式收音机上的按钮命名，在那里您按下一个按钮，之前选择的按钮就会再次弹出。
我们的示例代码看起来像这样
html
radio 输入类型的工作方式与 text 输入类型大致相同，但有一些区别
每组单选按钮的 name 属性必须包含相同的值，才能将它们作为一组关联起来。如果它们包含不同的值，它们将有效地是独立的集合，提交时具有不同的值。
您必须包含一个 value 属性，其中包含每个单选按钮要提交的值。提交的值将是名称/值对，但名称始终相同，例如 hotel=economy 或 hotel=superior。
每个单选按钮的
注意：除了构造和标记表单之外，字段集还有其他用途，例如禁用一整套控件作为一个单一单元。
值得注意的是，我们已将 checked 属性应用于第一个单选按钮——这使得它在页面首次加载时被选中。这意味着始终会选择一个选项，并且您无法在不选择另一个单选按钮的情况下取消选择一个单选按钮。
尝试从第一个单选按钮中删除 checked 属性，保存，然后重新加载，查看其效果。在继续之前将其放回。
禁用表单控件
在单选按钮示例中，您会注意到第三个单选按钮设置了 disabled 属性。这会导致渲染的控件变灰且无法选择。这在许多情况下都很有用，例如某个选项通常可用，但现在不可用。例如，产品可能缺货，或者像我们示例中的情况一样，顶层公寓都已预订满！
您可以在任何表单控件（包括
尝试在两个
