HTML_案例1_注册页面

用纯html页面,不用css画一个注册页面。

最终效果如下:

 html页面代码如下:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>注册页面</title>
</head>
<body>
    <form action="#" method="post">
        <!--IDEA的HTML页面,输入table+后没有自动提示,紧接着敲TAB键会自动补齐。 -->
        <table border="1" align="center" width="500px">
            <tr>
                <td><label for="username">用户名</label></td>
                <td><input type="text" name="username" id="username"></td>
            </tr>

            <tr>
                <td><label for="password">密码</label></td>
                <td><input type="password" name="password" id="password"></td>
            </tr>

            <tr>
                <td><label for="email">Email</label></td>
                <td><input type="text" name="email" id="email"></td>
            </tr>

            <tr>
                <td><label for="name">姓名</label></td>
                <td><input type="text" name="name" id="name"></td>
            </tr>

            <tr>
                <td><label for="tel">手机号</label></td>
                <td><input type="text" name="tel" id="tel"></td>
            </tr>

            <tr>
                <td><label>性别</label></td>
                <td>
                    <input type="radio" name="gender"  value="male">男
                    <input type="radio" name="gender"  value="female">女
                </td>
            </tr>

            <tr>
                <td><label for="birthday">出生日期</label></td>
                <td><input type="date" name="birthday" id="birthday"></td>
            </tr>

            <tr>
                <td><label for="checkcode">验证码</label></td>
                <td>
                    <input type="text" name="checkcode" id="checkcode">
                    <img src="img/verify_code.jpg">
                </td>
            </tr>

            <tr>
                <!--合并单元格,占2列,设置td的属性 -->
                <td colspan="2" align="center"><input type="submit" value="注册"></td>
            </tr>

        </table>
    </form>
</body>
</html>

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:/a/123588.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

【Git】Git安装入门使用常用命令Gitee远程仓库上传文件与下载

一&#xff0c;Git入门 1.1 Git是什么 Git是一款分布式版本控制系统&#xff0c;被广泛用于软件开发中的源代码管理。它由Linus Torvalds在2005年创造并发布&#xff0c;旨在解决传统版本控制系统&#xff08;如SVN&#xff09;的一些局限性。主要用于敏捷高效地处理任何或小或…

【解决方案】vue 项目 npm run dev 时报错:‘cross-env‘ 不是内部或外部命令,也不是可运行的程序

报错 cross-env 不是内部或外部命令&#xff0c;也不是可运行的程序 或批处理文件。 npm ERR! code ELIFECYCLE npm ERR! errno 1 npm ERR! estate1.0.0 dev: cross-env webpack-dev-server --inline --progress --config build/webpack.dev.conf.js npm ERR! Exit status 1 np…

Pytorch 里面torch.no_grad 和model.eval(), model.train() 的作用

torch.no_grad: 影响模型的自微分器&#xff0c;使得其停止工作&#xff1b;这样的话&#xff0c;数据计算的数据就会变快&#xff0c;内存占用也会变小&#xff0c;因为没有了反向梯度计算&#xff0c;当然&#xff0c;我哦们也无法做反向传播。 model.eval() 和model.train()…

Dockerfile搭建lnmp

目录 任务需求&#xff1a; 一、准备&#xff1a; 二、部署nginx容器&#xff08;172.18.0.10&#xff09;&#xff1a; 1.编写Dockerfile构建镜像&#xff1a; 2.准备nginx配置文件&#xff1a; 3.构建镜像&#xff0c;启动nginx容器&#xff1a; 三、部署mysql容器&#x…

Flutter学习:使用CustomPaint绘制路径

Flutter学习&#xff1a;认识CustomPaint组件和Paint对象 Flutter学习&#xff1a;使用CustomPaint绘制路径 Flutter学习&#xff1a;使用CustomPaint绘制图形 Flutter学习&#xff1a;使用CustomPaint绘制文字 Flutter学习&#xff1a;使用CustomPaint绘制图片 drawPath 绘制路…

矢量绘图软件Sketch 99 for mac

Sketch是一款为用户提供设计和创建数字界面的矢量编辑工具。它主要用于UI/UX设计师、产品经理和开发人员&#xff0c;帮助他们快速设计和原型各种应用程序和网站。 Sketch具有简洁直观的界面&#xff0c;以及丰富的功能集&#xff0c;使得用户可以轻松地创建、编辑和共享精美的…

C++ vector 动态数组的指定元素删除

文本旨在对 C 的容器 vector 进行肤浅的分析。 文章目录 Ⅰ、vector 的指定元素删除代码结果与分析 Ⅱ、vector 在新增元素后再删除指定元素代码结果与分析 Ⅲ、vector 在特定条件下新增元素代码结果与分析 参考文献 Ⅰ、vector 的指定元素删除 代码 #include <iostream&g…

Python语言:经典例题分析讲解

题1&#xff1a; 通过观察我们可以得出以下结论&#xff1a; 代码实现&#xff1a; """ &#xff08;3&#xff09;输入整数n&#xff0c;输出n行的字符图案。如n5时输出以下图案&#xff1a;* *** ***** ******* *********""""" for…

河南开放大学与电大搜题微信公众号:携手共进,助力学习之路

作为河南省内颇具影响力和声誉的高等教育机构之一&#xff0c;河南开放大学一直致力于提供优质的教育资源和灵活的学习方式&#xff0c;以满足广大学习者的需求。而在这个追求知识的时代&#xff0c;学习者们尤其需要一个便捷、高效的工具来辅助学习。电大搜题微信公众号应运而…

python编程复习系列——week2(Input Output (2))

文章目录 一、多行代码语句二、Escape序列三、字符串格式四、数值运算课后作业 一、多行代码语句 &#x1f95e;使用反斜杠\来表示在下一行中继续使用一条语句。 subject_code "CSCI111" subject_mark 80 subject_grade "D" result "Subject re…

软件测试|黑盒测试方法论-判定表

在因果图分析法中最后会得出一个判定表&#xff0c;可以看出因果图和判定表是有联系的&#xff0c;一般需要结合起来使用。 因果图是一种分析工具&#xff0c;通过分析最终得到判定表&#xff0c;再通过判定表编写测试用例。在一定情况下也可以直接书写判定表&#xff0c;省略…

使用eXplorer本地搭建免费在线文件管理器并实现远程登录——“cpolar内网穿透”

文章目录 1. 前言2. eXtplorer网站搭建2.1 eXtplorer下载和安装2.2 eXtplorer网页测试2.3 cpolar的安装和注册 3.本地网页发布3.1.Cpolar云端设置3.2.Cpolar本地设置 4.公网访问测试5.结语 1. 前言 通过互联网传输文件&#xff0c;是互联网最重要的应用之一&#xff0c;无论是…

Docker 学习路线 13:部署容器

部署容器是使用Docker和容器化管理应用程序更高效、易于扩展和确保跨环境一致性性能的关键步骤。本主题将为您概述如何部署Docker容器以创建和运行应用程序。 概述 Docker容器是轻量级、可移植且自我包含的环境&#xff0c;可以运行应用程序及其依赖项。部署容器涉及启动、管…

设计模式之生产者/消费者模式

文章目录 1. 简介2. 代码实现 1. 简介 生产者消费者模式与保护性暂停模式的GuardObject不同&#xff0c;它不需要产生结果和消费结果的线程一一对应。它使用一个消息队列来平衡生产者和消费者的线程资源。其中生产者仅负责产生结果数据&#xff0c;不关心数据该如何处理&#…

【算法与数据结构】17、LeetCode电话号码的字母组合

文章目录 一、题目二、解法三、完整代码 所有的LeetCode题解索引&#xff0c;可以看这篇文章——【算法和数据结构】LeetCode题解。 一、题目 二、解法 思路分析&#xff1a;本题需要解决的问题有三个&#xff1a; 一、如何实现数字到字母的映射二、如何实现组合问题三、如何解…

基于OpenFOAM求解器二次开发

OpenFOAM&#xff08;Open Field Operation and Manipulation&#xff09;是一个开源的计算流体动力学&#xff08;CFD&#xff09;软件包。它提供了各种模拟和建模工具&#xff0c;用于研究和解决复杂的流体流动问题。 OpenFOAM提供了一个强大的求解器库&#xff0c;可以用于…

边缘计算多角色智能计量插座:用电监测和资产管理的未来智能化引擎

目前主流的智能插座涵盖了红外遥控&#xff08;控制空调和电视等带有红外标准的电器&#xff09;&#xff0c;配备着测温、测湿等仓库应用场景&#xff0c;配备了人体红外或者毫米波雷达作为联动控制&#xff0c;但是大家有没有思考一个问题&#xff0c;就是随着对接的深入&…

汽车标定技术(三)--XCP协议如何支持测量功能

目录 1. 概述 2. 测量方式 -- Poll 3. 测量方式 -- DAQ 3.1 ODT概念模型 3.2 DAQ List概念 3.3 ODT 绝对编号和相对编号 3.4 静态DAQ和动态DAQ模式 &#xff08;1&#xff09;静态DAQ &#xff08;2&#xff09;动态DAQ 4.小结 1. 概述 在该系列的首篇文章汽车标定技…

轻量封装WebGPU渲染系统示例<19>- 使用GPU Compute材质多pass实现元胞自动机之生命游戏(源码)

当前示例源码github地址: https://github.com/vilyLei/voxwebgpu/blob/feature/rendering/src/voxgpu/sample/GameOfLifeMultiMaterialPass.ts 系统特性: 1. 用户态与系统态隔离。 细节请见&#xff1a;引擎系统设计思路 - 用户态与系统态隔离-CSDN博客 2. 高频调用与低频调…

苍穹外卖-day06

苍穹外卖-day06 课程内容 HttpClient微信小程序开发微信登录导入商品浏览功能代码 功能实现&#xff1a;微信登录、商品浏览 微信登录效果图&#xff1a; 商品浏览效果图&#xff1a; 1. HttpClient 1.1 介绍 HttpClient 是Apache Jakarta Common 下的子项目&#xff0c;…