html的练习之用户注册表单

article/2025/9/23 20:49:02

这是最终效果图,具体实现代码在下面,一些注意点在代码里有注释,对是新手学习html基础比较友好。 本人刚接触前端学习,这里当作作业的练习,不足之处,欢迎交流,共同进步!

 

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>用户注册表单</title>
</head>
<body><!--用户注册:用户名密码确认密码性别兴趣爱好学历简介--><!--form表单method属性:get:采用get方式提交的时候,用户提交的信息会显示在浏览器的地址栏上post:采用post方式提交的时候,用户信息不会显示在浏览器地址栏上当用户提交的信息中含有敏感信息,例如:密码,建议采用post方式提交method属性不指定时,默认的是get请求--><!--这里的http://192.168.111.3:8080/jd/register没有实际意义,仅当作练习使用--><form action="http://192.168.111.3:8080/jd/register" method="post">用户名<input type="text" name="username"><br>密码<input type="password" name="userpwd"><br>确认密码<input type="password">性别<input type="radio" name="gender" value="1" checked>男<!--单选按钮的value必须手动指定,这里name后面的值必须相同,否则性别选项不是单选,value值不能相同,数字或者字母没有实际意义哦,可根据自己喜欢设置--><input type="radio" name="gender" value="0">女<br>兴趣爱好<input type="checkbox" name="interest" value="smoking" checked>抽烟<input type="checkbox" name="interest" value="driking">喝酒<input type="checkbox" name="interest" value="hotHead">烫头<br>学历<select name="grade" ><option value="gz" selected>高中</option>  <!--默认选中--><option value="dz">大专</option><option value="bk">本科</option><option value="yjs">研究生</option></select><br>简介<br> <!--文本域:文本域没有value属性,用户填写的内容就是value--><textarea  cols="30" rows="10" name="introduce"></textarea><br><input type="submit" value="注册"><input type="reset" value="清空"></form>
</body>
</html>


http://chatgpt.dhexx.cn/article/0XJdBZ2I.shtml

相关文章

Java Web注册表单编写

编写注册表单 1.要做下列的这样一个表单信息&#xff1a; 2.方法主体里面添加表单 < form action“提交地址” method“post”> 表单内容&#xff08;包括按钮&#xff0c;输入框&#xff0c;选择框等&#xff09;< /form> 我们可以看到在测试中的结果&#xff…

003_用户注册表单【HTML-form表单】

文章目录 一、HTML-form表单1、用户注册表单2、用户注册表单 - 小升级3、HTML5表单新特性① 新的input type 一、HTML-form表单 1、用户注册表单 <html><head><meta charset"UTF-8"><title>HTML用户注册表单</title></head>&l…

javascript实现较全功能注册表单

今天笔者仿照京东注册表单&#xff0c;进行设计了一个表单案例&#xff0c;在这个案例中&#xff0c;可以完成常见表单注册的绝大部分功能&#xff0c;比如表单注册信息的验证&#xff0c;校验用户名&#xff0c;校验密码强弱&#xff0c;注册信息的追踪。这其中用到了正则表达…

HTML5实现注册表单

注册表单代码 <!DOCTYPE html> <html><head><meta charset"utf-8" /><title>注册账号</title></head><body><form action"getSend.php" method"GET"><fieldset><legend>注册…

JQuery用户注册表单验证

使用jquery编写代码实现用户注册表单的验证功能&#xff1a; 用户名、密码、确认密码和手机号不能为空密码长度在8~20位之间&#xff0c;密码至少由数字、字母或下划线其中两种组成确认密码必须和密码一致手机号应该是11位&#xff0c;并且是合法的手机号段验证码随机生成&…

jQuery简单的注册表单

注册表单的实现思想及步骤 明确自己需要收集的注册信息并在Html上写出表单的布局在js上进行数据接收和验证&#xff0c;向服务器发起注册请求&#xff0c;处理请求返回的数据。 代码实现 html代码 <form><div><span>用户名&#xff1a;</span><…

Web实现:简单的注册表单

Web实现&#xff1a;简单的注册表单。 结果图如下&#xff1a; HTML部分代码&#xff1a; <!DOCTYPE html> <html lang"en"> <head><meta charset"UTF-8"><meta name"viewport" content"widthdevice-width, i…

【HTML】-- 用户注册表单

【HTML】-- 用户注册表单 使用html标签做一个简单的注册表单&#xff0c;下面是一些常用的标签。 button标签&#xff1a;普通按钮&#xff0c;功能代码自定义。 submit&#xff1a;“确定” &#xff0c;提交到后台。 reset&#xff1a;“取消” &#xff0c;让表单控件原内容…

前端学习笔记--注册表单

表单在网页中主要负责数据采集功能html中使用form标签完成。表单标签其实是一组标签的组合&#xff0c;不是一个标签。表单元素是允许用户在表单中&#xff08;比如&#xff1a;输入框、文本域、下拉列表、单选框、复选框等等&#xff09;输入信息的元素。 在html中使用来定义…

表单的学习——简单的注册窗口

1.表单form&#xff08;formtab&#xff09; 我们要利用制作一个简单的注册页面。代码如下&#xff1a; <!DOCTYPE html> <html lang"en"> <head><meta charset"UTF-8"><title>表单</title> </head> <body…

web前端学习(四)——HTML 表单(1)- 用户注册表单举例

表单&#xff1a;就是类似于登录界面&#xff0c;用于接收用户的信息。&#xff08;如下图的微博登录界面所示&#xff09; 表单以<form>开始&#xff0c;以</form>结束。 1、表单有什么用&#xff1f; 收集用户信息。表单展现之后&#xff0c;用户填写表单…

注册表单 html+css

简洁注册表单 <!DOCTYPE html> <html lang"en"> <head><meta charset"UTF-8"><title>注册</title><link rel"stylesheet" href"public.css"><link rel"stylesheet" href&quo…

linux系列之常用运维命令整理笔录

系列博客专栏&#xff1a; JVM系列博客专栏SpringBoot系列博客 本博客记录工作中需要的linux运维命令&#xff0c;大学时候开始接触linux&#xff0c;会一些基本操作&#xff0c;可是都没有整理起来&#xff0c;加上是做开发&#xff0c;不做运维&#xff0c;有些命令忘记了&…

50个Linux常用命令

1.查看主机名:hostname 2.查看当前工作目录:pwd 3.切换工作目录:cd 4.查看目录: ls -l 长格式 -a全部显示 -d显示目录属性 -h人性化 -R递归显示 5.查看系统版本 lsb_release -a 6.查看cpu cat/cpu/cpuinfo 7.查看内存 cat/proc/meminfo 8.关机 shutdown -h now 、poweroff 、…

linux下解压gz文件夹提示格式不对,在Linux解压tar.gz文件时提示gzip:stdin:not的解决问题...

不经意间我们又来到了Linux系统文章的学习&#xff0c;在众多学习中&#xff0c;我们的文章也许不起眼&#xff0c;但是想必大家都有很多问题吧&#xff0c;所以重要的下面我们就来讲解一下&#xff0c;大家一定要认真看奥&#xff01;&#xff01; 我们都知道Linux系统下的tar…

Red Hat Linux Shell命令

文章目录 一、辅助快捷键二、基本命令三、用户命令四、关于文件目录的命令五、压缩文件命令六、安装命令五、网络 “-”&#xff1a;引导短格式选项&#xff08;单个字符&#xff09;如&#xff1a;-l多个短格式选项可以写在一起&#xff0c;用一个"-"引导 如&#x…

Linux常用命令/查找/搜索命令/压缩/解压命令网络命令

在线课堂&#xff1a;https://www.100ask.net/index&#xff08;课程观看&#xff09; 论  坛&#xff1a;http://bbs.100ask.net/&#xff08;学术答疑&#xff09; 开 发 板&#xff1a;https://100ask.taobao.com/ &#xff08;淘宝&#xff09;      https://weid…

linux tar -czvf 详解,Linux tar命令详解

当你想要压缩一大堆文件时,你得先将这一大堆文件先打成一个包(tar命令),然后再用压缩程序进行压缩(gzip bzip2命令) tar常见命令参数 必要参数有如下: -A 新增压缩文件到已存在的压缩 -c 建立新的压缩文件 -d 记录文件的差别 -r 添加文件到已经压缩的文件 -u 添加改变了和现…

Java中几种常量池(字符串常量池, Class常量池, 运行时常量池)的区别与联系

简介&#xff1a; 这几天在看Java虚拟机方面的知识时&#xff0c;看到了有几种不同常量池的说法&#xff0c;然后我就去CSDN、博客园等上找资料&#xff0c;里面说的内容真是百花齐放&#xff0c;各自争艳&#xff0c;因此&#xff0c;我好好整理了一下&#xff0c;将我自认为…

Java字符串常量池详解(StringTable)

前言&#xff1a;在介绍字符串常量池之前&#xff0c;我们先来简单了解下Java中字符串的概念以及常见的一些问题. 参考书籍&#xff1a; 《Java核心技术》 参考网站&#xff1a;牛客 作者水平很有限&#xff0c;如果发现错误&#xff0c;麻烦及时告知作者哦&#xff01;十分感谢…