菜单
×
   ❮     
HTML CSS JAVASCRIPT SQL PYTHON JAVA PHP HOW TO W3.CSS C C++ C# BOOTSTRAP REACT MYSQL JQUERY EXCEL XML DJANGO NUMPY PANDAS NODEJS R TYPESCRIPT ANGULAR GIT POSTGRESQL MONGODB ASP AI GO KOTLIN SASS VUE DSA GEN AI SCIPY AWS CYBERSECURITY DATA SCIENCE
     ❯   

HTML <form> 标签


示例

一个包含两个输入字段和一个提交按钮的 HTML 表单

<form action="/action_page.php" method="get">
  <label for="fname">名:</label>
  <input type="text" id="fname" name="fname"><br><br>
  <label for="lname">姓氏:</label>
  <input type="text" id="lname" name="lname"><br><br>
  <input type="submit" value="提交">
</form>
自己动手试一试 »

更多“自己尝试”的例子见下文。


定义和用法

The <form> tag is used to create an HTML form for user input.

The <form> element can contain one or more of the following form elements


浏览器支持

元素
<form>

属性

Attribute 描述
accept-charset character_set Specifies the character encodings that are to be used for the form submission
action URL 指定提交表单数据时发送到的位置
autocomplete on
off
Specifies whether a form should have autocomplete on or off
enctype application/x-www-form-urlencoded
multipart/form-data
text/plain
指定提交表单数据时如何进行编码(仅适用于 method="post")
method dialog
get
post
指定发送表单数据时要使用的 HTTP 方法
name text Specifies the name of a form
novalidate novalidate 指定提交表单时不对表单进行验证
rel external
帮助
license
next
nofollow
noopener
noreferrer
opener
prev
search
Specifies the relationship between a linked resource and the current document
target _blank
_self
_parent
_top
Specifies where to display the response that is received after submitting the form

全局属性

The <form> tag also supports the Global Attributes in HTML.


事件属性

The <form> tag also supports the Event Attributes in HTML.



更多示例

示例

一个包含复选框的 HTML 表单

<form action="/action_page.php" method="get">
  <input type="checkbox" name="vehicle1" value="Bike">
  <label for="vehicle1"> 我有一辆自行车</label><br>
  <input type="checkbox" name="vehicle2" value="Car">
  <label for="vehicle2"> 我有一辆汽车</label><br>
  <input type="checkbox" name="vehicle3" value="Boat" checked>
  <label for="vehicle3"> I have a boat</label><br><br>
  <input type="submit" value="提交">
</form>
自己动手试一试 »

示例

一个包含单选按钮的 HTML 表单

<form action="/action_page.php" method="get">
  <input type="radio" id="html" name="fav_language" value="HTML">
  <label for="html">HTML</label><br>
  <input type="radio" id="css" name="fav_language" value="CSS" checked="checked">
  <label for="css">CSS</label><br>
  <input type="radio" id="javascript" name="fav_language" value="JavaScript">
  <label for="javascript">JavaScript</label><br><br>
  <input type="submit" value="提交">
</form>
自己动手试一试 »

相关页面

HTML 教程: HTML 表单与输入

HTML DOM 参考: Form 对象

CSS 教程: 表单样式


默认 CSS 设置

Most browsers will display the <form> element with the following default values

示例

form {
  display: block;
  margin-top: 0em;
}
自己动手试一试 »


×

联系销售

如果您想将 W3Schools 服务用于教育机构、团队或企业,请发送电子邮件给我们
sales@w3schools.com

报告错误

如果您想报告错误,或想提出建议,请发送电子邮件给我们
help@w3schools.com

W3Schools 经过优化,旨在方便学习和培训。示例可能经过简化,以提高阅读和学习体验。教程、参考资料和示例会不断审查,以避免错误,但我们无法保证所有内容的完全正确性。使用 W3Schools 即表示您已阅读并接受我们的使用条款Cookie 和隐私政策

版权所有 1999-2024 Refsnes Data。保留所有权利。W3Schools 由 W3.CSS 提供支持