---
title: 表单和按钮
slug: learn/HTML/Forms_and_buttons
tags:
  - 初学者
  - 指引
  - 文章
  - 表单
translation_of: Learn/HTML/Forms_and_buttons
---
<p>{{draft}}{{LearnSidebar}}</p>

<p class="summary">表单和按钮是Web的一个非常重要的部分 - 这些允许您的站点访问者输入数据并将其发送给您（例如注册，登录和反馈表单），并且您可以实现控制以控制复杂功能（例如提交表单） 到服务器，或暂停播放视频。）这个模块可以帮助您入门。</p>

<h2 id="先决条件">先决条件</h2>

<p>在开始本单元之前，您应该对<a href="/en-US/docs/Learn/HTML/Introduction_to_HTML">HTML的基础知识</a>有一定的了解，如HTML简介中所述。 如果你没有通过这个模块（或类似的东西），先完成它，然后再回来！</p>

<div class="note">
<p><strong>Note</strong>: 如果你是在计算机/平板电脑等其他你无法创建文件的设备上的话，你可以尝试在在线代码编辑平台上运行代码例如 <a class="external external-icon" href="http://jsbin.com/" rel="noopener">JSBin</a> 或 <a class="external external-icon" href="https://thimble.mozilla.org/" rel="noopener">Thimble</a>.</p>
</div>

<h2 id="向导">向导</h2>

<p>本模块包含以下的文章</p>

<dl>
 <dt><a href="/en-US/docs/Learn/HTML/Forms_and_buttons/Basics">表单和按钮基础知识</a>（Form and button basics）</dt>
 <dd>     在本文中，我们将向您介绍HTML表单的基础知识，包括它们的用途，基本功能和常用表单控件。 我们还将了解HTML按钮以及如何使用它们。</dd>
 <dt>形成语义和结构</dt>
 <dd>     存在许多元素，允许我们将表单结构化为更易于使用和访问 - 其中一些是专门的表单元素，其中一些是通用HTML容器。 在本文中，我们将介绍创建表单结构的最佳实践。</dd>
 <dt>高级表单功能</dt>
 <dd>       在这里，我们将介绍HTML表单中可用的一些更高级的功能，例如数据列表，进度条，滑块以及最小值和最大值。</dd>
 <dt>表格验证</dt>
 <dd>     在我们的最终表单文章中，我们将讨论表单验证，讨论为什么有必要，并查看HTML选项卡提供的一些功能，以便客户端验证表单数据。</dd>
</dl>

<h2 id="练习">练习</h2>

<dl>
 <dt>表单练习</dt>
 <dd>等待完成（to be done）</dd>
</dl>