📜  HTML 表单

📅  最后修改于: 2022-05-13 01:57:35.384000             🧑  作者: Mango

HTML 表单

HTML 代表超文本标记语言。它用于使用标记语言设计网页。它是超文本和标记语言的组合。 HTML 使用预定义的标签和元素来告诉浏览器如何正确地在屏幕上显示内容。形式就是其中之一。因此,在本文中,我们将了解什么是 HTML 表单,表单的元素是什么,以及如何在网页中使用 HTML 表单。

什么是 HTML <表单>?

是一个 HTML 元素,用于收集包含交互式控件的输入数据。它提供了输入文本、数字、值、电子邮件、密码和控制字段(例如复选框、单选按钮、提交按钮等)的工具,或者换句话说,表单是一个包含输入元素的容器,例如文本、电子邮件、数字, 单选按钮, 复选框, 提交按钮等。当你想从用户那里收集数据时通常会使用表单。例如,用户想在线购买一个包,所以他/她必须先在地址表单中输入他们的送货地址,然后在支付表单中添加他们的付款详细信息才能下订单。

通过在段落、预格式化文本、列表和表格中放置输入字段来创建表单。这为设计表单布局提供了相当大的灵活性。

句法:


  

表单元素

这些是以下 HTML

元素:

  • 它为 元素定义标签。
  • 用于通过改变表单的类型从表单中获取文本、密码、电子邮件等各种类型的输入数据。
  •   


HTML



  
  
  
  GfG


  
    
      Personal Details        

               

         

               

         

               

         

        Gender :                         

         

               

         

               

         

               

         

               

       
  


输出:

在上面的例子中,我们可以看到输入文本和输入密码的区别。用户名将可见,但密码将不可见。

HTML 表单中的单选按钮

为了创建一个单选按钮,我们使用单选类型后面的 标签来为用户提供有限数量的选择。

句法:

注意:单选按钮必须具有相同的名称才能被视为一个组。

注意: value 属性定义了与每个单选按钮关联的唯一值。该值不会显示给用户,而是在“提交”时发送到服务器以识别选择了哪个单选按钮的值。

例子:

在此示例中,我们将创建一个单选按钮来选择您的性别。

HTML




  Page Title


  

Select your gender

  
            

输出:

HTML 表单中的复选框

要在 HTML 表单中创建复选框,我们使用 标记,后跟输入类型复选框。这是一个方框,勾选以激活它。它曾经一次选择更多选项。

句法:

注意: “name”和“value”属性用于将复选框数据发送到服务器。

例子:

在本例中,我们使用复选框来选择语言。

HTML




  Page Title


  

Choose Language

  
    
          
  • Hindi
  •       
  • English
  •       
  • Sanskrit
  •     
   

输出:

HTML 表单中的组合框

组合框用于在您的表单中创建一个包含多个选项的下拉菜单。因此,要在 HTML 表单中创建 Combobox,我们使用

注意: “名称”和“值”属性用于将组合框数据发送到服务器。

例子:

在本例中,我们将创建一个下拉菜单来选择国籍。

HTML




  Page Title


  

Select Your Nationality

  
      

输出:

HTML 表单中的提交按钮

在 HTML 表单中,提交按钮用于将表单的详细信息提交给表单处理程序。表单处理程序是服务器上带有用于处理输入数据的脚本的文件。

句法:

例子:

HTML




  Page Title


  

Welcome To GeeksforGeeks

  
     

            

           

       

           

    

输出:

HTML 表单中的文本区域

在 HTML 表单中,文本区域用于在表单中添加评论或评论或地址。或者换句话说,文本区域是一个多行文本输入控件。它包含无限数量的字符,文本以固定宽度的字体呈现,文本区域的大小由 属性给出。要在表单中创建文本区域,请使用

注意: name 属性用于在将 textarea 数据发送到服务器后引用它。

例子:

HTML




  Page Title


  

Welcome To GeeksforGeeks

  
       

输出:

创建一个 HTML 表单来输入学生的基本信息

在此示例中,我们将获取诸如称呼、名字、姓氏、电子邮件、电话、性别、出生日期和地址等输出。

为了创建这个表单,我们需要使用 标签来定义标题, 标签用来定义 First Name, Last Name, Email, Phone,出生日期通过更改 标签类型属性,                

         

               

          

输出: