当前位置: 首页 > 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…...

Redis相关知识总结(缓存雪崩,缓存穿透,缓存击穿,Redis实现分布式锁,如何保持数据库和缓存一致)

文章目录 1.什么是Redis&#xff1f;2.为什么要使用redis作为mysql的缓存&#xff1f;3.什么是缓存雪崩、缓存穿透、缓存击穿&#xff1f;3.1缓存雪崩3.1.1 大量缓存同时过期3.1.2 Redis宕机 3.2 缓存击穿3.3 缓存穿透3.4 总结 4. 数据库和缓存如何保持一致性5. Redis实现分布式…...

ArcGIS Pro制作水平横向图例+多级标注

今天介绍下载ArcGIS Pro中如何设置水平横向图例。 之前我们介绍了ArcGIS的横向图例制作&#xff1a;ArcGIS横向、多列图例、顺序重排、符号居中、批量更改图例符号等等&#xff08;ArcGIS出图图例8大技巧&#xff09;&#xff0c;那这次我们看看ArcGIS Pro如何更加快捷的操作。…...

laravel8+vue3.0+element-plus搭建方法

创建 laravel8 项目 composer create-project --prefer-dist laravel/laravel laravel8 8.* 安装 laravel/ui composer require laravel/ui 修改 package.json 文件 "devDependencies": {"vue/compiler-sfc": "^3.0.7","axios": …...

CSS设置元素的宽度根据其内容自动调整

width: fit-content 是 CSS 中的一个属性值&#xff0c;用于设置元素的宽度根据其内容自动调整&#xff0c;确保宽度刚好容纳内容而不会超出。 效果对比 默认情况&#xff08;width: auto&#xff09;&#xff1a; 块级元素&#xff08;如 <div>&#xff09;会占满父容器…...

华为OD机考-机房布局

import java.util.*;public class DemoTest5 {public static void main(String[] args) {Scanner in new Scanner(System.in);// 注意 hasNext 和 hasNextLine 的区别while (in.hasNextLine()) { // 注意 while 处理多个 caseSystem.out.println(solve(in.nextLine()));}}priv…...

【C++进阶篇】智能指针

C内存管理终极指南&#xff1a;智能指针从入门到源码剖析 一. 智能指针1.1 auto_ptr1.2 unique_ptr1.3 shared_ptr1.4 make_shared 二. 原理三. shared_ptr循环引用问题三. 线程安全问题四. 内存泄漏4.1 什么是内存泄漏4.2 危害4.3 避免内存泄漏 五. 最后 一. 智能指针 智能指…...

Redis:现代应用开发的高效内存数据存储利器

一、Redis的起源与发展 Redis最初由意大利程序员Salvatore Sanfilippo在2009年开发&#xff0c;其初衷是为了满足他自己的一个项目需求&#xff0c;即需要一个高性能的键值存储系统来解决传统数据库在高并发场景下的性能瓶颈。随着项目的开源&#xff0c;Redis凭借其简单易用、…...

脑机新手指南(七):OpenBCI_GUI:从环境搭建到数据可视化(上)

一、OpenBCI_GUI 项目概述 &#xff08;一&#xff09;项目背景与目标 OpenBCI 是一个开源的脑电信号采集硬件平台&#xff0c;其配套的 OpenBCI_GUI 则是专为该硬件设计的图形化界面工具。对于研究人员、开发者和学生而言&#xff0c;首次接触 OpenBCI 设备时&#xff0c;往…...

学习一下用鸿蒙​​DevEco Studio HarmonyOS5实现百度地图

在鸿蒙&#xff08;HarmonyOS5&#xff09;中集成百度地图&#xff0c;可以通过以下步骤和技术方案实现。结合鸿蒙的分布式能力和百度地图的API&#xff0c;可以构建跨设备的定位、导航和地图展示功能。 ​​1. 鸿蒙环境准备​​ ​​开发工具​​&#xff1a;下载安装 ​​De…...

热门Chrome扩展程序存在明文传输风险,用户隐私安全受威胁

赛门铁克威胁猎手团队最新报告披露&#xff0c;数款拥有数百万活跃用户的Chrome扩展程序正在通过未加密的HTTP连接静默泄露用户敏感数据&#xff0c;严重威胁用户隐私安全。 知名扩展程序存在明文传输风险 尽管宣称提供安全浏览、数据分析或便捷界面等功能&#xff0c;但SEMR…...