html_inpute标签

下面分3段示例说明inpute标签里面相关标签的细节使用方法

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
</head>
<body>
    <form action="url" method="get">  <!--form内的内容才能提交,action表示提交的目的地址;method有get和post默认是get。get是将form里面的数据添加到url里面进行提交;
    post是将提交的数据放在内容里面提交。默认只能提交inpute里面的值,其它标签的内容提交不了-->
        <input type="text" name="username" value="xxx">  <!-- 普通文本输入框(单行),type=“password”密文显示,value可以填写输入框的默认值-->
        <input type="password" name="pwd"> <!--为数据提交到后台,后台能够取到对应数据,需要使用name与对应数据关联,移交到后台的一个字典,name的value是字段对应的key-->
        <input type="button" value="登录button">  <!--登录按钮,与登录框联合使用,其实button是无法提交的,无论是否在form标签内-->
        <input type="submit" value="登录submit">  <!--登录按钮,与登录框联合使用,单独没办法提交,必须放在form标签内才能提交-->
    </form>
</body>
</html>

 

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
</head>
<body>
<!--互斥标签选项 -->
<form enctype="multipart/form-data">
    <div> <!--将多个互斥选项放到一行 -->
        <div>性别</div>
        <span>男:</span> <input type="radio" name="gender" value="1"> <!--type=radio是小圆点选项,将需要互斥的选项name写成一样即可实现在页面互斥选项的结果 -->
        <span>女:</span> <input type="radio" name="gender" value="2">  <!--后台通过value来识别选的哪一个,get方法里面gender=1/2/3-->
        <span>未知:</span> <input type="radio" name="gender" value="3">
    </div>
    <p>
        <div>爱好</div>
        篮球:<input type="checkbox" name="hobby" value="1"> <!--type checkbox实现复选框,name用来区分不同的复选框,value识别同一复选框内各个选项-->
        足球:<input type="checkbox" name="hobby" value="2" checked="checked"> <!--checked使选项默认被选中-->
        乒乓球:<input type="checkbox" name="hobby" value="3">
    </p>
    <p>
        <div>技能</div>
        云计算:<input type="checkbox" name="skill" value="1">
        数通:<input type="checkbox" name="skill" value="1">
    </p>

    <p>上传文件</p>
    <input type="file" name="fname" value="选择文件">  <!--上传文件,依赖于form表单的enctype属性-->

    <input type="reset" value="重置">
</form>

</body>
</html>

 

转载于:https://www.cnblogs.com/flags-blog/p/10263327.html

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值