html注册页面基本元素及初级验证

<!DOCTYPE html>
<html>
 <head>
  <meta charset="utf-8">
  <title>注册</title>
 </head>
 <body>
  <h1>注册</h1>
  <form action="图像标签.html" method="get">
   <!-- value是框内初始显示内容 readonly作用是只能看不能改     hidden隐藏作用   placeholder作用是提示作用一开始显示,一输入就消失了
   初级验证  {required非空判断}
   {placeholder作用是提示作用一开始显示,一输入就消失了}
   {pattern正则表达式 在脚本之家搜索表达式限制输入框的内容条件}-->
   <p>用户名: <input type="text" name="username"maxlength="8"size="30"placeholder="请输入用户名"required "></p>
   <p>密码: <input type="password" name="pwd" value=""placeholder="请输入密码"></p>
   <p>性别:
   <!-- 单选框name认定男和女两个选项是一组的,这样就可以实现单选框的作用,只能选择一个
    disabled禁用作用:不能选择这个选项-->
    <input type="radio"value="boy"name="sex"/>男
    <input type="radio"value="girl"name="sex"/>女
   </p>
   <p>爱好:
   <!--多选框 这里的name是认定这几个选项是一组的 -->
    <input type="checkbox"value="sleep"name=hobby"">睡觉
    <input type="checkbox"value="game"name=hobby"">打游戏
    <input type="checkbox"value="run"name=hobby"">跑步
    <input type="checkbox"value="magictube"name=hobby"">魔方
    
   </p>
   <!-- 按钮   button普通按钮   其中value元素的内容就是实际按钮上显示的内容
      image图像按钮
      submit提交按钮
      reset重置按钮-->
   <input type="button"name="btn1"value="点击变长">
   <p>国家:
   <!-- 列表框 -->
    <select name="列表名称" id="">
     <option value="china">中国</option>
     <option value="us"selected>美国</option>
     <option value="jupan">日本</option>
     <option value="uk">英国</option>
    </select>
    
   </p>
   <p>反馈:
   <!--文本框 cols表示长度(横向)  rows是宽度(纵向)    文本内容表示一开始在文本框里初始显示的内容-->
    <textarea name="textarea" id="" cols="80" rows="10">文本内容</textarea>
   </p>
   <p>
    <!-- file是一种选择文件的元素 -->
    <input type="file"name="files">
    <input type="button"value="上传"name="upload">
   </p>
   <p>邮箱:
    <input type="email"name="email">
   </p>
   <p>URL:
   <input type="url"name="url">
   </p>
   <p>商品数量:
   <!-- 数字输入 -->
    <input type="number"name="num"max="100"min="0"step="1">
   </p>
   <p>音量:
   <!-- 滑块元素 -->
    <input type="range"name="voice"min="0"max="100"step="2">
   </p>
   <p>搜索:

 

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

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值