当前位置: 首页 > news >正文

注册信息页面

知识点:

!+Enter  直接生成前端基本框架

1.<h1></h1> (2,3,4,5)  表示各级标题

2.<form></form> 表单建立

3.<input type=" "></input> 表格(表单嵌套表格)

type属性说明
text文本框,输入单行文本
password密码框
radio单选框
checkbox多选框
file上传文件

单选多选框默认值属性为:checked

密码框文本框提示信息属性为:placeholder

4.<label></label> 标签名

5.<select></select> 下拉选项框

嵌套<option></option>  

6.<br> 换行

7.<ul></ul> 无序列表

<li><a href=" "></a href></li> 无序列表嵌套li,href属性为超链接

8. <button></button>  点击确认标签

编码:

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <title>注册信息</title>

</head>

<body>

    <!-- 标题一 -->

    <h1>注册信息</h1>

    <!--建立表单  -->

    <form action="">

        <!-- 表单控件 -->

         <h2>个人信息</h2>

         <!-- 标签加文本框,文本框里面用属性placholder提醒文本 -->

         <label>姓名:</label><input type="text" placeholder="请输入真实姓名">

         <!-- 换行 -->

          <br><br>

         <label for="">密码:</label><input type="password" placeholder="请输入密码">

         <br><br>

         <label for="">确认密码:</label><input type="password" placeholder="请输入确认密码">

         <br><br>

         <label>性别:</label>

         <!-- checked默认性别:女生,增大点击范围 -->

        <label><input type="radio" name="gender"> 男</label>

        <label><input type="radio" name="gender" checked> 女</label>

        <br><br>

        <label>居住城市</label>

        <!-- 下拉选项框 -->

         <select>

            <option>北京</option>

            <option>上海</option>

            <option>广州</option>

            <option>武汉</option>

            <option>四川</option>  

         </select>

    </form>

    <h1>教育经历</h1>

    <form action="">

        <label for="">最高学历</label>

        <select name="" id="">

            <option value="">博士</option>

            <option value="">研究生</option>

            <option value="">本科</option>

            <option value="">专科</option>

        </select>

    </form>

    <label for="">学校名称:</label><input type="text" placeholder="请正确输入学校信息">

    <br><br>

    <label for="">所学专业:</label><input type="text">

    <br><br>

    <label for="">在校时间:</label>

    <select name="" id="">

        <option value="">2015</option>

        <option value=""> 2016</option>

    </select>

    --

    <select name="" id="">

        <option value="">2016</option>

        <option value="">2017</option>

    </select>

    <br><br>

    <h1>工作经历</h1>

    <form action="">

        <label for="">公司名称:</label><input type="text">

        <br><br>

        <label for="">工作描述:</label>

        <br>

        <!-- 可自动换行的文本框 -->

        <textarea name="" id=""></textarea>

        <input type="text">

        <br><br>

        <input type="checkbox"><label for="">已阅读并同意以下协议</label>

        <!-- 无序列表带黑点,嵌套li,href代表超链接 -->

        <ul>

            <li><a href="http://baidu.com">用户服务协议</a></li>

            <li><a href="">隐私政策</a></li>

        </ul>

    </form>

    <br><br>

    <button>免费注册</button>

    <button>重新填写</button>

</body>

</html>

相关文章:

注册信息页面

知识点&#xff1a; &#xff01;&#xff0b;Enter 直接生成前端基本框架 1.<h1></h1> (2,3,4,5) 表示各级标题 2.<form></form> 表单建立 3.<input type" "></input> 表格&#xff08;表单嵌套表格&#xff09; type属…...

详解Java中的BIO、NIO、AIO

1、 详解Java中的BIO、AIO、NIO 1.1、引言 IO流是Java中比较难理解的一个知识点&#xff0c;但是IO流在实际的开发场景中经常会使用到&#xff0c;比如Dubbo底层就是NIO进行通讯。本文将介绍Java发展过程中出现的三种IO&#xff1a;BIO、NIO以及AIO&#xff0c;重点介绍NIO。…...

CAN和CANFD如何转换和通信

随着科技的发展&#xff0c;汽车电子和工业领域中CAN通信需要承载数据量也越来越大&#xff0c;传统CAN通信有了向CANFD通信过渡的倾向。在实现过渡的过程中可能会出现自己设备是CAN通信&#xff0c;客户设备是CANFD通信的情况&#xff0c;或者自己设备是CANFD通信&#xff0c;…...

QDateTimeEdit Class

Header:#include qmake:QT += widgets Inherits:QAbstractSpinBox Inherited By:QDateEdit and QTimeEdit Public Types enum Section {NoSection, AmPmSection, MSecSection, SecondSection, MinuteSection, …, YearSection } flags SectionsProperties calendarPopu…...

Windows环境安装CentOS7

【注意】安装CentOS需要先安装Vmware虚拟机 【下载前准备】 一、下载CentOS 7镜像文件阿里云镜像开源&#xff0c;点击跳转 二、安装VMware&#xff08;17&#xff09;&#xff1a; a. 官网&#xff0c;点击跳转 b. 许可证&#xff1a;JU090-6039P-08409-8J0QH-2YR7F 安装V…...

用docker启动mysql步骤

以下是在 Docker 中启动 MySQL 的详细步骤&#xff1a; **一、拉取 MySQL 镜像 ** 1. 打开终端&#xff0c;确保 Docker 服务正在运行。可以使用以下命令检查 Docker 服务状态&#xff1a; sudo systemctl status docker 2. 使用以下命令拉取 MySQL 官方镜像&#xff1a; d…...

[Linux] Linux 初识进程地址空间 (进程地址空间第一弹)

标题&#xff1a;[Linux] Linux初识进程地址空间 个人主页水墨不写bug &#xff08;图片来源于AI&#xff09; 目录 一、什么是进程地址空间 二、为什么父子进程相同地址的变量的值不同 三、初识虚拟地址、页表 一、什么是进程地址空间 其实&#xff0c;在很久之前&#xf…...

力扣21~25题

21题&#xff08;简单&#xff09;&#xff1a; 分析&#xff1a; 按要求照做就好了&#xff0c;这种链表基本操作适合用c写&#xff0c;python用起来真的很奇怪 python代码&#xff1a; # Definition for singly-linked list. # class ListNode: # def __init__(self, v…...

04. prometheus 监控 Windows 服务器

prometheus 监控 Windows 服务器 1. 下载安装 Windows_exporter 安装包下载&#xff1a;https://github.com/prometheus-community/windows_exporter/releases 下载 msi 版本&#xff0c;上传至要监控的 Windows 服务器&#xff0c;双击安装即可&#xff0c;exporter 会自动…...

【机器学习】——决策树以及随机森林

文章目录 1. 决策树的基本概念与结构1.1 决策树的构建过程 2. 决策树的划分标准2.1 信息增益&#xff08;Information Gain&#xff09;2.2 信息增益比&#xff08;Information Gain Ratio&#xff09;2.3 基尼指数&#xff08;Gini Index&#xff09;2.4 均方误差&#xff08;…...

怎么选择合适的数据恢复软件?适用于 Windows 的数据恢复软件对比

针对 Windows 的领先数据恢复软件的全面回顾&#xff1a; 丢失重要数据对任何 Windows 用户来说都是一场噩梦。从意外删除到系统崩溃&#xff0c;数据丢失是一个非常普遍的问题。值得庆幸的是&#xff0c;有强大的数据恢复工具可以帮助找回丢失的文件。这篇评论深入探讨了适用于…...

CI/CD 和 DevOps 工具概述:Jenkins 、Docker 的概述、工作流程、对比

随着软件开发的复杂性不断增加&#xff0c;持续集成&#xff08;CI&#xff09;、持续交付&#xff08;CD&#xff09;和运维&#xff08;Ops&#xff09;的概念逐渐成为现代软件开发流程中的核心组成部分。这些概念促进了开发团队与运维团队之间的协作&#xff0c;提升了软件的…...

基于SpringBoot+Vue+uniapp的高校教务管理小程序系统设计和实现

2. 详细视频演示 文章底部名片&#xff0c;联系我获取更详细的演示视频 3. 论文参考 4. 项目运行截图 代码运行&#xff0c;效果展示图 代码运行&#xff0c;效果展示图 代码运行&#xff0c;效果展示图 代码运行&#xff0c;效果展示图 代码运行&#xff0c;效果展示图 5. 技…...

如何在 Ubuntu VPS 上从 Apache Web 服务器迁移到 Nginx

前些天发现了一个巨牛的人工智能学习网站&#xff0c;通俗易懂&#xff0c;风趣幽默&#xff0c;忍不住分享一下给大家。点击跳转到网站。 简介 在启动网站或应用程序时&#xff0c;您需要做出许多选择。有时&#xff0c;您的需求会发生变化&#xff0c;新技术变得可行&#x…...

pikachu靶场总结(一)

最近看到好多人还在打这个靶机所以把以前写的总结放上来了&#xff0c;主要是皮卡丘靶场漏洞的原理&#xff0c;利用方式&#xff0c;防护方法简略总结&#xff0c;纯手敲记录&#xff0c;总结如果不到位请评论区留言&#xff01; 一、暴力破解 1.基于表单的暴力破解 原理&a…...

No.2 笔记 | 网络安全攻防:PC、CS工具与移动应用分析

引言 在当今数字化时代,网络安全已成为每个人都应该关注的重要话题。本文将总结一次关于网络安全攻防技术的学习内容,涵盖PC端和移动端的恶意程序利用,以及强大的渗透测试工具Cobalt Strike的使用。通过学习这些内容,我们不仅能够了解攻击者的手法,更能提高自身的安全意识和防…...

QD1-P8 HTML格式化标签

本节学习&#xff1a;HTML 格式化标签。 本节视频 www.bilibili.com/video/BV1n64y1U7oj?p8 ‍ 一、font 标签 用途&#xff1a;定义文本的字体大小、颜色和 face&#xff08;字体类型&#xff09;。 示例 <!DOCTYPE html> <html><head><meta cha…...

WordPress修改固定链接后301的重定向方法

网站改版实际上是很忌讳的&#xff0c;尤其是针对已被搜索引擎收录的网站&#xff0c;新站不用考虑这些问题&#xff0c;而已经收录的网站网页在不遵守搜索引擎规则的前提下&#xff0c;是会被降权&#xff0c;关键词排名下滑、流量IP会被剥夺、收录会减少 、业务成交量会急剧下…...

关于Allegro导出Gerber时的槽孔问题

注意点一&#xff1a; 如果设计的板子中有 槽孔和通孔(俗称圆孔)&#xff0c;不仅要NC Drill, 还要 NC Route allegro导出的槽孔文件后缀是 .rou 圆型孔后缀 是 .drl &#xff0c;出gerber时需要看下是否有该文件。 注意点二&#xff1a; 导出钻孔文件时&#xff0c;设置参…...

平时使用的正则总结

1、将某一个字符串的后缀名后面加上“!400_500” 使用场景是将minio拿过来的图片压缩尺寸从而压缩其大小&#xff0c;加快渲染的速度。需要在图片的后缀名后面加上尺寸如下&#xff1a; const str //storage-test.test.shiqiao.com/gateway/common/isopen/2024/10/09/e708e9…...

终极英雄联盟辅助工具League Akari:3分钟快速上手指南

终极英雄联盟辅助工具League Akari&#xff1a;3分钟快速上手指南 【免费下载链接】League-Toolkit An all-in-one toolkit for LeagueClient. Gathering power &#x1f680;. 项目地址: https://gitcode.com/gh_mirrors/le/League-Toolkit 你是否厌倦了在英雄联盟客户…...

LabVIEW多语言界面开发:基于JKI Simple Localization的控件本地化实战

1. 项目概述与核心思路 在开发面向全球用户的LabVIEW应用程序时&#xff0c;多语言界面支持是一个绕不开的刚需。想象一下&#xff0c;你的测控软件或工业自动化系统需要部署到不同国家&#xff0c;如果每次都要为不同语言单独开发一套界面&#xff0c;那工作量无疑是巨大的&am…...

终极指南:如何用Python实现手机号反查QQ号的3种高效方法

终极指南&#xff1a;如何用Python实现手机号反查QQ号的3种高效方法 【免费下载链接】phone2qq 项目地址: https://gitcode.com/gh_mirrors/ph/phone2qq 在数字身份管理日益复杂的今天&#xff0c;你是否遇到过忘记某个手机号绑定了哪个QQ账号的困扰&#xff1f;或者需…...

别再手动画图了!用Graphviz + Python自动生成流程图,效率提升10倍

用PythonGraphviz实现自动化图表生成&#xff1a;告别低效手绘时代 你是否曾在PPT中反复调整箭头位置&#xff0c;只为让一张流程图看起来更专业&#xff1f;或是花半小时拖拽图形&#xff0c;却发现某个节点的颜色需要全局修改&#xff1f;在技术文档、系统架构设计或算法可视…...

探索工程图纸的数字化世界:DXF图纸的C++解析及OpenCV绘制

探索工程图纸的数字化世界&#xff1a;DXF图纸的C解析及OpenCV绘制 【下载地址】DXF图纸的C解析及OpenCV绘制 本仓库提供了一套解决方案&#xff0c;用于解析DXF&#xff08;AutoCAD Drawing Interchange Format&#xff09;图纸文件&#xff0c;并利用C编程语言结合OpenCV库将…...

如何快速掌握CircuitJS1:免费高效的浏览器电路仿真终极指南

如何快速掌握CircuitJS1&#xff1a;免费高效的浏览器电路仿真终极指南 【免费下载链接】circuitjs1 Electronic Circuit Simulator in the Browser 项目地址: https://gitcode.com/gh_mirrors/ci/circuitjs1 CircuitJS1是一款功能强大的电子电路仿真工具&#xff0c;它…...

别再为前后端AES加解密头疼了!手把手教你用CryptoJS和Java 8实现无缝对接

跨平台AES加解密实战&#xff1a;打通CryptoJS与Java的密钥对齐与编码陷阱 前后端分离架构下&#xff0c;数据安全传输始终是开发者的核心关切。当看到控制台抛出javax.crypto.BadPaddingException: Given final block not properly padded这类错误时&#xff0c;多数开发者都会…...

如何彻底解决C盘空间不足问题:Windows Cleaner开源工具终极指南

如何彻底解决C盘空间不足问题&#xff1a;Windows Cleaner开源工具终极指南 【免费下载链接】WindowsCleaner Windows Cleaner——专治C盘爆红及各种不服&#xff01; 项目地址: https://gitcode.com/gh_mirrors/wi/WindowsCleaner 你是否曾因C盘爆红而束手无策&#xf…...

ExploitDB二进制漏洞库使用教程:快速查找和利用漏洞的简单方法

ExploitDB二进制漏洞库使用教程&#xff1a;快速查找和利用漏洞的简单方法 【免费下载链接】exploitdb-bin-sploits The legacy Exploit Database repository - New repo located at https://gitlab.com/exploit-database/exploitdb-bin-sploits 项目地址: https://gitcode.c…...

《Kubernetes应用篇:使用Helm工具部署mongodb 8.2.7副本集群》

总结:整理不易,如果对你有帮助,可否点赞关注一下? 更多详细内容请参考:《K8S集群运维指南》 一、简介 使用Helm结合Bitnami Chart是部署生产级mongodb到Kubernetes集群的事实标准方案。整个过程高度自动化,可以极大地简化运维复杂度。 在实际生产环境中,为了保障稳定运…...