html表单基础实战

编辑: admin 分类: 电脑知识 发布时间: 2023-06-14 来源:互联网
表单基础

在html中，通常把form标签称为表单
表单不会对页面样式产生任何影响，但它会影响页面的行为
它可以将表单中的数据，使用指定的请求方式（get或post），提交到指定的服务器地址。

1. 表单的基本构造

<form>标签用于创建供用户输入的 HTML 表单，我们也必须要把所有表单标签放在form标签内部。

  • 语法
    1. <form>
    2.   <!--各种表单元素-->
    3. </form>

  • 举例

    1. <!DOCTYPE html>
    2. <html lang="en">
    3. <head>
    4.   <meta charset="UTF-8">
    5.   <meta http-equiv="X-UA-Compatible" content="IE=edge">
    6.   <meta name="viewport" content="width=device-width, initial-scale=1.0">
    7.   <title>表单基础</title>
    8. </head>
    9. <body>
    10.   <form>
    11.       <div>
    12.           <label for="name">用户名</label>
    13.           <input type="text" id="name" />
    14.       </div>
    15.   </form>
    16. </body>
    17. </html>
    2. 常用表单元素
  • 表单控件的分组" class="reference-link"><fieldset>表单控件的分组
    • <legend> 标签为 <fieldset> 元素定义标题。
  • 标签规定了用户可以在其中输入数据的输入字段。" class="reference-link"><input>标签规定了用户可以在其中输入数据的输入字段。

    用来声明允许用户输入数据的 input 控件。输入字段可通过多种方式改变，取决于 type 属性。