初学html第二篇章之表单-CSDN博客

本文链接：https://blog.csdn.net/weixin_44703686/article/details/117476677

html表单用于搜集不同类型的用户输入，用<form>元素定义表单。表单元素指的是不同类型的 input 元素、复选框、单选按钮、提交按钮等等。

1、<input>元素

是最重要的元素，有很多的形态，有不同的type属性

其中：

文本输入<input type="text">定义用于文本输入的单行输入字段。

单选按钮输入<input type="radio">定义单选按钮。注意单选按钮允许用户在有限数量的选项中选择其中之一。

提交按钮<input type="submit">定义用于向表单处理程序提交表单的按钮；表单处理程序通常是包含用来处理输入数据的脚本的服务器页面。表单处理程序在表单的action属性中指定的。

2、 action 属性

定义在提交表单时执行的动作。向服务器提交表单的通常做法是使用提交按钮。

通常，表单会被提交到 web 服务器上的网页。

3、举一个小栗子：

要实现下面这个页面，我们就可以利用表单来进行制作。

代码如下：

<html>
    <head>
        <title>表单的实现</title>
    </head>
    <body>
        <h2>添加新人员</h2>
        <form>
            员工姓名：
            <input type="text" name="employee name">
            <br>
            <br>
            初始密码：
            <input type="text" name="num">
            <br>
            <br>
            状态：
            <input type ="radio" name="post" value="在职" checked>在职
            <input type ="radio" name="dimission" value="离职" >离职
            <br>
            <br>
            员工等级：
            <select>
                <option value ="1">门店-实习生</option>
                <option value ="2">门店-经理</option>
                <option value="3">门店-前台</option>
                <option value="4">门店服务员</option>
             </select><br>
             <br>
             角色：
             <select>
                <option value ="1">实习生</option>
                <option value ="2">经理</option>
                <option value="3">前台</option>
                <option value="4">服务员</option>
             </select><br>
             <br>
             性别：
             <input type ="radio" name="male" value="sex" >男
             <input type ="radio" name="female" value="sex" checked>女
             <br>
             <br>
             住址：
             <input type="text" name="address">
             <br>
             <br>
             电话：
             <input type="text" name="telephone">
             <br>
             <br>
             所属店铺：
             <input type="text" name="store">
             <br>
             <br>
             <input type="submit" value="提交">
        </form>
    </body>
</html>

这样操作就将一个简易的表单做好啦，今天的分享就到这里啦！通过今天的学习我对于html有了更加深入的理解，相信在未来会越来越好。给自己一个小鼓励，加油！！！