前端的学习之路：初级HTML---表单

new-SkyWaller

于 2021-02-02 13:04:23 发布

阅读量72

点赞数

分类专栏：初级HTML 文章标签： html 前端

本文链接：https://blog.csdn.net/weixin_44647555/article/details/113529699

版权

初级HTML 专栏收录该内容

15 篇文章 1 订阅

订阅专栏

表单

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>表单</title>
</head>
<body>
    <!-- 
        表单：
            -在显示生活中表单用于提交数据
            -在网页中也可以使用表单，网页中的表单用于将把本地的数据提交到服务器
     -->
     <!-- form的属性
            action 表单要提交的服务器的地址    
    -->
     <form action="11.25.04.1.form.html">
        <!-- 文本框 
        注意：数据要提交到服务器中，必须要为元素指定一个name属性
        属性值是啥无所谓，开发中根据需求-->
       文本框 <input type="text" name="hello">
       <br><br>
       <!-- 密码框 -->
       密码框<input type="password" name="password">
       <br><br>
        <!--单选按钮  name值不同的可以多选，name值一样只能选一个，name值一样才能单选
         像这种选择框，必须指定一个value属性，value属性最终会作为用户填写的值传递给服务器
        checked 可以将单选按钮设置为默认选中
        -->
           
         单选按钮<input type="radio" name="lop" value="a">
                <input type="radio" name="lop" value="b">
                <input type="radio" name="ml" checked>
       <br><br>
       <!-- 多选框 -->
       多选框 <input type="checkbox" name="test" value="1">
       <input type="checkbox" name="test" value="2">
       <input type="checkbox" name="test" value="3" checked>
       <br><br>
       <!-- 下拉列表 -->
       <select name="cue">
           <!-- selected 设置为默认选中 -->
           <option  value="1">选项一</option>
           <option  value="2">选项二</option>
           <option selected value="3">选项三</option>
       </select>
       <br><br>
        <!-- 提交按钮
        默认值是“提交”，可以通过value修改默认值
        -->
        <input type="submit" >
        <br>
        <input type="submit" value="注册">
     </form>
</body>
</html>

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <h1>您的数据数据收到</h1>
</body>
</html>

可通过提交按钮，提交数据

运行结果为：
在这里插入图片描述

new-SkyWaller

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
前端的学习之路：初级HTML---表单

表单<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>表单</title></head><body> <!--
复制链接

扫一扫