web前端开发HTML/css用户登录界面

代码:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
</head><body>
<div align="center">
<div style="border:1px dashed #000;width:550px;height:350px;line-height:1.5;list-style-type:none;text-align:left;padding:50px;"><form>
<table><tr><td>我的邮箱:</td><td ><input type="text"/></td></tr><tr><td>创建密码:</td><td><input type="password"/></td></tr><tr><td>验证密码:</td><td><input type="password"/></td></tr><tr><td align="center">昵&nbsp&nbsp&nbsp称:</td><td><input type="text"/></td></tr> <tr><td align="center"><label for="position">所&nbsp在&nbsp地:</label></td><td><select style="type:square;"><option>海口市</option><option>三亚市</option><option>三沙市</option><option>儋州市</option><option>五指山市</option><option>琼海市</option><option>文昌市</option><option>万宁市</option><option>东方市</option><option>其他</option></select></td></tr>
</table><table><tr><td>性别:</td>
<td><input id="option1" type="radio"/ name="option"/></td>
<td><label for="man">男</label></td>
<td><input id="option2" type="radio"/ name="option"/><label for="woman">女</label></td>
<td><input id="option3" type="radio"/ name="option"/><label for="secret">保密</label></td>
</tr></table><table><tr>
<td>自我介绍:</td></tr></tr>
<td><textarea type="text" style="border:1px solid #000;width:500px;height:90px;display:-webkit-box;-webkit-line-clamp:10;font-size:32px;"/></textarea></td>
</tr></table><table><tr>
<td>兴趣爱好: </td><td><input id="sport" type="checkbox" name="hobby"/>
<label for="sport">运动</label></td>
<td><input id="read" type="checkbox" name="hobby"/></td>
<td><label for="read">读书</label></td>
<td><input id="shopping" type="checkbox" name="hobby"/></td>
<td><label for="shopping">逛街</label></td>
<td><input id="muise" type="checkbox" name="hobby"/></td>
<td><label for="muise">听音乐</label></td>
<td><input id="draw" type="checkbox" name="hobby"/></td>
<td><label for="draw">画画</label></td>
</tr></table><input type="image" name="用户登录" src="表格布局案例-学习强国/images/login.png" width="88" height="28"/>
<input type="button" value="注册"/><input type="reset" value="重置"/></form>
</div>
</div>
</body>
</html>

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

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

react学习--Redux的使用

Redux 的核心思想是通过一个单一的状态树来管理应用的状态&#xff0c;状态的修改通过纯函数&#xff08;reducers&#xff09;来进行&#xff0c;从而使状态变化可追踪和可预测。 1、安装 Redux&#xff1a; 在项目中安装 Redux 库和 React-Redux&#xff08;用于 React 绑定…

神经网络常用归一化和正则化方法解析(一)

&#x1f380;个人主页&#xff1a; https://zhangxiaoshu.blog.csdn.net &#x1f4e2;欢迎大家&#xff1a;关注&#x1f50d;点赞&#x1f44d;评论&#x1f4dd;收藏⭐️&#xff0c;如有错误敬请指正! &#x1f495;未来很长&#xff0c;值得我们全力奔赴更美好的生活&…

Diary11-Word文字

Word文字 一.标尺与标记 1.标尺 1.1标尺的打开方式 标尺&#xff1a;视图->标尺(选中即可) 1.2标尺的相关操作 左边的倒三角&#xff1a;【首行缩进】->第一行与左边的间距 左边的正三角&#xff1a;【悬挂缩进】->除了第一行之外的行与左边的间距 右边的正三角…

Win环境中安装Jenkins指南

目录 安装Java环境 下载并安装Jenkins Jenkins版本 启动Jenkins 如何删除Jenkins 安装Java环境 访问 Oracle官方网站 下载并安装JDK 安装完成后&#xff0c;设置系统环境变量 JAVA_HOME 到你的 JDK 安装路径&#xff0c;并将 %JAVA_HOME%\bin 添加到系统 PATH 中。 下载…

Apollo新版本Beta技术沙龙参会感受:未来的自动驾驶之旅

Apollo新版本Beta技术沙龙参会感受&#xff1a;未来的自动驾驶之旅 &#x1f697;&#x1f4a1; 文章目录 Apollo新版本Beta技术沙龙参会感受&#xff1a;未来的自动驾驶之旅 &#x1f697;&#x1f4a1;摘要引言正文&#x1f4cd; 参会流程介绍&#x1f31f; 参会收获&#x1…

「Verilog学习笔记」任意小数分频

专栏前言 本专栏的内容主要是记录本人学习Verilog过程中的一些知识点&#xff0c;刷题网站用的是牛客网 timescale 1ns/1nsmodule div_M_N(input wire clk_in,input wire rst,output wire clk_out );parameter M_N 8d87; parameter c89 8d24; // 8/9时钟切换点parameter di…

封装时间轴组件 timeline

要求时间轴的点展示进度百分比&#xff0c;线也根据进度不同展示不同长度的颜色 实现效果&#xff1a; 使用的组件库是vant的circle 子组件&#xff1a; <template><div class"m-timeline-area" :style"width: ${width}px"><div class&qu…

python读取txt,csv, 等不同格式的文件——(待完善)

python 读取txt文件 1.python读取txt文件&#xff08;多种方法&#xff09;

#名词区别篇:事件流事件委托addEventListener白屏时间首屏时间

事件流 事件捕获 —从外到内 到达目标 事件冒泡—从内到外 事件委托 定义&#xff1a;当有大量子元素触发事件时&#xff0c;将事件监听器绑定在父元素进行监听&#xff0c;此时数百个事件监听器变成一个监听器。 e.currentTarget 与 e.target 有何区别 Event 接口的只读…

前端利用JS获取最近1、3、5、n年的开始时间和结束时间

1.获取最近1年的开始时间和结束时间 function getLastYearStartAndEnd() {const currentDate new Date();const currentYear currentDate.getFullYear();const currentMonth currentDate.getMonth() 1;const lastYearStart new Date(currentYear - 1, currentMonth, 1);c…

聊聊 Jetpack Compose 的 “状态订阅自动刷新” -- 你真的了解重组吗?

Jekpack Compose “状态订阅&自动刷新” 系列&#xff1a; 【 聊聊 Jetpack Compose 的 “状态订阅&自动刷新” - - MutableState/mutableStateOf 】 【 聊聊 Jetpack Compose 的 “状态订阅&自动刷新” - - remember 和重组作用域 】 【 聊聊 Jetpack Compose 的 …

Spring Cloud 配置 Druid(二)

不废话&#xff0c;直接上代码&#xff0c; Nacos搭建的微服务&#xff0c;可以看Spring Cloud 配置 Nacos&#xff08;一&#xff09;-CSDN博客 一&#xff0c;pom文件 spring-cloud-starter-alibaba-nacos-discovery 和 spring-cloud-starter-openfeign 都是基于spring-cl…

Apollo新版本Beta技术沙龙的参会感受

Apollo新版本Beta技术沙龙的参会感受 Apollo新版本Beta技术沙龙的参会感受摘要 &#x1f697;&#x1f310;参会流程 &#x1f5d3;️展厅参观/展厅讲解 &#x1f3e2;进入百度Apollo未来驾驶汽车5G云代驾的神奇签到 &#x1f4dd;Apollo新版本Beta整体介绍 &#x1f680;技术分…

C语言:用递归的方法求斐波那契数列:1,1,2,3,5,8,……的前40个数

分析&#xff1a; 首先&#xff0c;在代码的起始部分&#xff0c;包含<stdio.h>头文件&#xff0c;这个头文件提供了输入和输出的函数。 然后&#xff0c;定义了四个变量&#xff1a;f、f1、f2和i。f1和f2是斐波那契数列的前两个数字&#xff0c;初始化为1。f是当前计…

qt使用wimlib-imagex,做windows系统备份还原

wimlib-imagex是个第三方工具&#xff0c;可对系统映像进行操作&#xff0c;下载地址&#xff1a; https://wimlib.net/downloads/index.html 程序主要用到以下这两个文件&#xff1a;libwim-15.dll和wimlib-imagex.exe wimlib-imagex.exe的调用命令参数&#xff0c;可以通过…

【Docker】资源配额及私有镜像仓库

资源配额及私有镜像仓库 一、Docker资源配额1.1、控制cpu1.1.1、cpu份额控制1.1.2、core核心控制1.1.3、配额控制参数的混合使用 1.2、控制内存1.3、控制IO1.4、资源释放 二、Docker私有镜像仓库Harbor2.1、Harbor简介2.2、为Harbor自签发证书【1】生成ca证书【2】生成域名的证…

输出完全二叉树中某个结点的双亲和所有子孙。假设完全二叉树的顺序存储在一维数组A[n]中。

思路&#xff1a; 首先定义两个函数&#xff0c;getParent函数用于获取指定结点的双亲结点的索引&#xff0c;printDescendants函数用于输出指定结点的所有子孙。然后在main函数中&#xff0c;创建表示完全二叉树的数组A&#xff0c;并针对指定结点索引进行相关操作&#xf…

HOST文件被挟持,无法上网,如何解决。

问题&#xff1a; 晚上开机&#xff0c;突然发现无法联网&#xff0c;提示网络异常 解决&#xff1a; 首先网络诊断&#xff0c;host文件被劫持&#xff0c;修复后&#xff0c;仍然不行。 然后测试手机热点&#xff0c;发现仍然无法联网 尝试用火绒修复&#xff0c;无果。 所有…

Python 解析JSON实现主机管理

JSON&#xff08;JavaScript Object Notation&#xff09;是一种轻量级的数据交换格式&#xff0c;它以易于阅读和编写的文本形式表示数据。JSON 是一种独立于编程语言的数据格式&#xff0c;因此在不同的编程语言中都有对应的解析器和生成器。JSON 格式的设计目标是易于理解、…

【解决方案】环保设备用电与电网数据集中展示平台的应用与研究

摘 要&#xff1a;近年来&#xff0c;信息化不断推进&#xff0c;政府工作方式以及职能不断改革&#xff0c;许多省级环保部门开展环保与信息技术的融合&#xff0c;用于推进环保的发展。本文基于环境监测研究省级环保与电网数据集中展示平台的应用。环境监测是环保工作的重要组…