前端开发练习:HTML注册页面

前端开发学习--登录和注册页面设计(html和css,可完成两个页面点击切换) 今天学习了登录和注册页面的设计,主要是HTML和CSS部分,注册和切换采用了Js代码进行,后面将通过js进行填写内容的验证,进而可通过JSP跳转到Servlet进行DAO数据的校验,这属于后端部分了。 总体设计思路:整个页面设计可以分为主体(content)、头部(content-header)、内容(content-body)三个部分组成,其中是主体是根部,包含了头部和内容,头部和内容各自下设两... 阅读详情

效果图如下:

在这里插入图片描述
代码如下:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>注册页面</title>
</head>
<body>
    <h4>青春不常在,抓紧谈恋爱</h4>
    <table width="500">
<!--        第一行性别-->
        <tr>
            <td>性别:</td>
            <td>
                <input type="radio" name="sex" id="nan" checked="checked"> <label for="nan"> <img src="images/man.jpg"> 男</label>
                <input type="radio" name="sex" id="nv"> <label for="nv"> <img src="images/women.jpg"> 女 </label>
            </td>
        </tr>
<!--        第二行生日-->
        <tr>
            <td>生日:</td>
            <td>
                <select>
                    <option>--请选择年份--</option>
                    <option selected = "selected">1998</option>
                    <option>1999</option>
                    <option>2000</option>
                </select>
                <select>
                    <option>--请选择月份--</option>
                    <option>10</option>
                    <option>11</option>
                    <option>12</option>
                </select>
                <select>
                    <option>--请选择日期--</option>
                    <option>11</option>
                    <option>12</option>
                    <option>13</option>
                </select>
            </td>
        </tr>
<!--        第三行所在地区-->
        <tr>
            <td>所在地区:</td>
            <td><input type="text" value="请输入地区"></td>
        </tr>
<!--        第四行婚姻状况-->
        <tr>
            <td>婚姻状况:</td>
            <td>
                <input type="radio" name="marry" id="yihun"> <label for="yihun"> 已婚 </label>
                <input type="radio" name="marry" id="weihun" checked="checked"> <label for="weihun"> 未婚 </label>
                <input type="radio" name="marry" id="lihun"> <label for="lihun"> 离婚 </label>
            </td>
        </tr>
<!--        第五行学历-->
        <tr>
            <td>学历:</td>
            <td><input type="text" value="请输入学历"></td>
        </tr>
<!--        第六行喜欢的类型-->
        <tr>
            <td>喜欢的类型:</td>
            <td>
                <input type="checkbox" name="love"> 小鲜肉
                <input type="checkbox" name="love"> 老腊肉
                <input type="checkbox" name="love"> 男神
                <input type="checkbox" name="love"> 女神
            </td>
        </tr>
<!--        第七行自我介绍-->
        <tr>
            <td>自我介绍:</td>
            <td><textarea>请输入自我介绍</textarea></td>
        </tr>
<!--        第八行免费注册-->
        <tr>
            <td></td>
            <td>
                <input type="submit" value="免费注册">
            </td>
        </tr>
<!--        第九行收尾等等-->
        <tr>
            <td></td>
            <td>
                <input type="checkbox" checked="checked"> 我同意注册条款和会员加入标准
            </td>
        </tr>
        <tr>
            <td></td>
            <td>
                <a href="#"> 我是会员,立即登录 </a>
            </td>
        </tr>
        <tr>
            <td></td>
            <td>
                <h5> 我承诺 </h5>
                <ul>
                    <li>年满18岁、单身</li>
                    <li>抱着严谨的态度</li>
                    <li>真诚寻找另一半</li>
                </ul>
            </td>
        </tr>
    </table>
</body>
</html>
html+css制作简单注册登录页面 光标为手的形状,当光标指定这个div的时候,光标为手的形状。没有账号,去注册 忘记密码。前端页面要得到css的布局,就得在html页面里调用css文件。方框(请输入用户名)方框(请输入用户名)写完这一步,然后再去运行,是没有东西的,但是并不是不存在。例如我在注册这一块级里,我用鼠标指定这一区域时会变成蓝色。如果不加,我们可以根据内容的多少,设计多少白色的部分。.b{ } 是针对注册两个字后面的白色部分进行布局。 阅读详情

相关推荐

JavaScript、CSS、HTML 实现用户注册页面与信息校验

需求:实现用户注册页面并作出逻辑校验。要求:   (1)完成注册页面样式如下:   (2)页面提交,用户注册信息不符合规范,要显示红色提示框,如下:   (3)页面提交,用户注册信息不符合规范,要显示绿色提示框,如下:   分析:HTML实现页面元素,CSS做页面美化,JavaScript 实现逻辑校验;用户注册规则采用正则表达式。 1、HTML实现注册页面。   注:

胡根得 天行健,君子以自强不息。 4万+

小白第一个前端HTML案例

小白第一个前端HTML案例

weixin_55355246的博客 98

友情链接交换源码全功能生成html商业版.rar

新增加了生成html功能 添加了百度快照 统计代码 增加了修改个人资料必须输入密码 安全 留言 功能上的添加: 添加了百度快照 添加了留言本 增加了修改个人资料必须输入原密码 修正了会员可以任意修改其他会员的注册资料 修正了会员可以任意修改其他会员发布的网站资料 修正了会员可以任意删除其他会员发布的友情链接资料 后台:admin/ 用户名:admin 密码:admin888

青春不常在,抓紧谈恋爱 HTML案例

分析:除标题以外部分是一个两列的表格,一行两个,共分为11行。

m0_62452636的博客 1486

练习1:爱V猫友情链接页面(完成版).rar

Web前端框架与移动应用开发第一章爱V猫友情链接页面,内含完整代码以供参考学习。通俗易懂的代码人人都可看懂,适用于Web前端和移动应用开发方面的新手编程员们。

web前端中一个注册页面

自己平时的练习,我是今年才学的web,做的不好,希望大家不要介意,希望对大家有帮助。

web前端作业2

【代码】web前端作业2。

m0_71474212的博客 620

Web前端用户注册

登录,注册是我们使用的较多的表单认证,每个项目都从头开始写,显然是没有必要的。下面和大家分享下我所写的表单验证: 下面的代码,会附上完整代码,使用的过程中,只需要根据自己的项目进行简单的修改即可,非常方便。

前端基础-html-02

前端HTML中的表格、列表、表单知识,附有综合项目源码

L的博客 715

一个用户登录界面html

一个用户登录界面html

AI 生成 CAN 通信测试用例实战

本文分享了AI辅助汽车电子测试用例编写的实战经验。通过某车企CAN网络测试项目案例,对比传统方式(需27天)与AI辅助方式(仅5天)的效率差异,展示81%的效率提升。文章详细介绍了从DBC文件提取信号信息的方法,包括DBC文件结构解析、信号定义说明,并提供了完整的Python解析脚本代码,可将信号信息导出为JSON或Excel格式,为后续AI批量生成测试用例奠定基础。

小明的博客 695

Day02_HTML

文章目录1.文件标签2.文本标签3.图片标签4.列表标签5.链接标签6.块标签7.语义化标签8.表格标签9.表单标签 1.文件标签 1. 文件标签:构成html最基本的标签 * html:html文档的根标签 * head:头标签。用于指定html文档的一些属性。引入外部的资源 * title:标题标签。 * body:体标签 * <!DOCTYPE html>:html5中定义该文档是html文档 2.文本标签 2. 文本标签:和文本有关的标签 * 注释:<

weixin_45014721的博客 519

浅谈Android MVI架构---大自然的搬运工~~~

浅谈 Android MVI架构

hong_world的博客 2158

一个简单的登录注册页面html代码

文章目录前言一、效果展示1.登录2.注册二、代码部分1.登录2.注册总结 前言 这一个简单的注册页面代码,适合初学者进行模仿和理解,这个代码仅限于两个页面的跳转,不包括数据处理 一、效果展示 1.登录 2.注册 二、代码部分 1.登录 代码如下(示例): <style> * { padding: 0; margin: 0; box-sizing: border-box; } ..

weixin_55743273的博客 5万+

OpenCvSharp之利用海康相机采集图像并在pictureBox中显示

OpenCvSharp之利用海康相机采集图像并在pictureBox中显示 说明:OpenCvSharp版本为4.0 海康相机为黑白相机 实现功能:将海康相机采集的图像转成Mat,并在pictureBox中显示。 示例代码: Mat srcImage; private Mat CaptureImage() { int nRet; //MyCamera.MVCC_I...

Kevin_Sun777的博客 5503

NVIDIA Jetson Orin系列 - 使用SDK Manager安装JetPack全流程解析

本文详细解析了使用NVIDIA官方SDK Manager为Jetson Orin系列开发板安装JetPack系统的完整流程。从环境准备、设备进入恢复模式,到SDK Manager图形化界面的分步操作指南,提供了新手友好的全流程解析,并分享了安装后的验证方法及常见问题解决方案,帮助开发者高效搭建稳定的边缘AI开发环境。

nn3456的博客 407

HTML实现页面注册

网页版,注册页面 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>注册页面</title> <!-- 引入格式文件--> <link rel="stylesheet" href="html&css.css"> </head> <body> <sty

小蜗牛的珍贵百宝箱 4万+

避坑指南:合宙Air780EG阿里云一型一密连接时,为什么你的HmacMD5加密总失败?

本文针对合宙Air780EG模组连接阿里云物联网平台时,HmacMD5签名失败的常见问题提供深度解决方案。详细剖析了签名拼接格式、密钥使用、随机数处理及编码大小写等关键陷阱,并结合STM32嵌入式开发环境,给出了串口调试、分步验证及AT指令链路的实用排错技巧,帮助开发者顺利完成一型一密动态注册。

kiwi8的博客 441

登录注册HTML页面代码

一、注册 创建register.html文件,录入如下代码 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <style type="text/css"> form { width:100%;

zhaochongsi的博客 8万+

ansys 求解过程中出现未知错误。检查“求解信息”对象上的“求解器输出”,查找可能的原因。-静力学分析遇到的,这是什么原因——An unknown error occurred ——未找到解决方法

点击“确定”关闭弹窗后,进入Workbench的‌“求解信息”对象‌,查看‌“求解器输出”‌,搜索“Error”“Fatal”“Warning”等关键词,找到具体的错误描述,比如材料未定义、网格质量问题、内存不足等,这是精准解决问题的关键。进入“工具-选项-mechanical APDL”,取消勾选“分布式”,GPU加速器选择“none”。在“求解进程设置-高级”中调整内存分配参数,或切换为迭代求解器(如PCG求解器),它更省内存。尝试简化模型,比如删除非关键细节、合并重复部件,分步验证模型,定位问题源。

qq_15963745的博客 630

YOLOv11改进策略【模型轻量化】| 替换华为的极简主义骨干网络:VanillaNet

本文记录的是基于VanillaNet的YOLOv11轻量化改进方法研究。VanillaNet的极简主义在于无 shortcut 连接,并且在网络的每个阶段仅使用一层卷积,无额外复杂模块,仅通过自身简洁的架构设计和训练策略,实现有效地训练和优化。本文在替换骨干网络中配置了原论文中的、和11种模型,以满足不同的需求。

Limiiiing的博客 1726

HTML实现登录注册界面

我是一个初学者,学了有一星期的时间,分享一下最近在制作的登录注册界面。 登录页面:简单的运用了html和css的东西,没有用到js(目前功力不够)。 另外还用到了阿里巴巴矢量图标库的一些图标,毕竟自己不会做UI <!DOCTYPE > <html> <html lang="ch"> <head> <meta charset="utf-...

qq_44892111的博客 7万+

YOLOv8剪枝 稀疏训练+slim剪枝测试精度仅掉1.6个点,速度提高10.3fps!

摘要 本文介绍了YOLOv8剪枝方法Slim(Network Slimming),通过L1正则化作用于BN层的缩放因子(γ),自动识别并剪除冗余通道,实现模型轻量化。核心步骤包括:稀疏训练(引入L1正则化)、通道剪枝(按γ阈值裁剪)、微调恢复精度。实验表明,该方法能有效压缩模型大小、减少计算量,且支持通过调整speed_up等超参数控制剪枝强度。移植代码需修改C2F模块以适配剪枝,并配置稀疏训练参数(如reg、sl_epochs)。最终剪枝模型需移除优化器以减小体积,但不支持多卡训练。

FJN110的博客 862

登录注册页面跳转

用HTML、jQuery和css写一个简单的登录注册页面 看了一些前端部分的视频,有点手痒,想起大学时做的某管理系统的前端部分,当时基本都是靠着CV写的,现在想想应该可以自己写一点了。 话不多说,先上图: 首先是登录页面: 点击注册按钮可以跳转到注册页面: 注册页面做了一点简单的判断: 伪非空验证: 还有伪密码验证: 红字提示存在两秒,两秒后消失,清除密码框内的内容,但是不清除用户名框内的文本。 然后当用户名和密码输入正确以后(其实两次密码一样就行,用户名不空就好)就可以跳转到登录页面。这里有一个坑

qq_37807821的博客 5万+

win10 跳过U8环境检测的IE WebControls.rar

win10 安装u8的时候 提示IE WebControls 不通过,这个工具可以欺骗u8的检查。 跳过U8环境检测的IE WebControls。提示导入失败后,重新检测通过。

数学建模模型总结

这是本人在两年内准备参加数学建模竞赛搜集到的模型资料,已经经过了本人的筛选和整理,希望能够对准备参加数学建模竞赛的学弟学妹们提供一些帮助!

简单的html登录注册页面

简洁登录注册界面

gugugu08042的博客 4万+

OV9734 DATASHEET,完整规格书

OV9734完整规格书,包括电气参数,尺寸规格,寄存器配置表等

html静态登录、注册页面

html静态登录、注册页面(登录页面html)

H1453571548的博客 1万+

锂电池充电器电路设计 里面有电路

锂电池充电器电路设计 里面有电路 3.7V升压到5V电路设计。

上一篇: 前端开发练习:快报模块
下一篇: 前端开发练习:天气页面
APythonC
博客等级 码龄7年 23粉丝 58原创
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明:

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

余额充值