使用简单的Table标签制作注册页面

最新推荐文章于 2024-07-17 17:08:15 发布
最新推荐文章于 2024-07-17 17:08:15 发布
阅读量1.2k 收藏 5
点赞数 1
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/fzumrwang/article/details/89484457
版权

代码及其解释

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		<!-- 
			The form tag
				action:the address of submit
				method:
					get:default submission method,will concatenate(拼接) the parameters in the link
						it has the size bound(大小限制),so don't use get if you transmit large data
					post:Encapsulate(封装) parameters(参数) in the request body
						 it hasn't size bound.
						 
			input:
				type:the type of input item(项)
				name:it is regarded as the name of parameters when the form is submitted.
				id:name the input item to facilitate us to find it when we use it
		-->
		<form action="Home page.html" method="get">
			<!-- 
				the distinction between post and get
				link:https://blog.csdn.net/FZUMRWANG/article/details/89484399
			 -->
			<!-- if you use "post,it will hidden the parameters" -->
			<!-- 
				hidden area:mainly used to store some ID message in the page
			 -->
			<input type="hidden" value="djfjskfjskfajs" />
			<!--文本输入框-->
			<!-- if you input data in the text and click the submit button,the name and the data will appear at website links-->
			用户名:<input type="text" name="username" id="123" /> <br />
			<!--密码框-->
			密码:<input type="password" /> <br/>
			确认密码:<input type="password" /> <br />
			邮箱:<input type="text" /> <br />
			手机号码:<input type="text" /> <br />
			照片:<input type="file" /> <br />
			<!--radio取相同的名字表示一组就能实现单选效果-->
			性别:<input type='radio' name='sex' />男<input type='radio' name='sex' />女 <br />
			爱好:
				<input type="checkbox" />抽烟
				<input type="checkbox" />喝酒
				<input type="checkbox" />撸代码
				<input type="checkbox" />大保健
			<br />
			择偶要求:<textarea clos="40" rows="4">身材火辣</textarea>
			<br />
			籍贯：
				<select>
					<option>--请选择--</option>
					<option>湖北</option>
					<option>内蒙</option>
				</select>
				<br />
			验证码:<input type='text' /> <br />
			
			<input type="submit" value="sign in" />
			<input type="submit" value="sign up" />
			<input type="button" value="ordinal(普通的) button" />
			<input type="reset" value="reset button" />
		</form>
        
	</body>
</html>

显示效果

在这里插入图片描述

点击sign in跳转

在这里插入图片描述

稍微好一点点的版本

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		<table width="100%">
			<tr>
				<td background="img/325154.jpg" height="500px" width="100%">
					<table border="5px" width="60%" height="80%" bgcolor="snow" align="center">
						<tr>
							<td>
								<table width="60%" align="center">
									<tr>
										<td colspan="2"><font color="blue">会员注册 USER REGISTER</ font></td>
									</tr>
									<tr>
										<td>用户名:</td>
										<td>
											<input type="text" placeholder="请输入用户名"/>
										</td>
									</tr>
									<tr>
										<td>密码:</td>
										<td>
											<input type="password" placeholder="请输入密码"/>
										</td>
									</tr>
									<tr>
										<td>确认密码:</td>
										<td>
											<input type="password" placeholder="请再次输入密码"/>
										</td>
									</tr>
									<tr>
										<td>E-mail:</td>
										<td>
											<input type="email" placeholder="请输入邮箱"/>
										</td>
									<tr>
										<td>姓名:</td>
										<td>
											<input type="text" placeholder="请输入真实姓名"/>
										</td>
									</tr>
									<tr>
										<td>姓别:</td>
										<td>
											<input type="radio" name="sex" /> 男
											<input type="radio" name="sex" /> 女
										</td>
									</tr>
									<tr>
										<td>出生日期</td>
										<td>
											<input type="data" />
										</td>
									</tr>
									<tr>
										<td>验证码</td>
										<td>
											<input type="text" placeholder="请输入真实姓名"/>
										</td>
									</tr>
									<tr>
										<td></td>
										<td>
											<input type="submit" value="注册"/>
										</td>
									</tr>
									</tr>
								</table>
							</td>
						</tr>
					</table>
				</td>
			</tr>
		</table>
	</body>
</html>

显示效果在这里插入图片描述

阿黄Ahuang
关注
注册页面
DDFFR的博客
03-28 1636
package Client;//看到背景图后不能看到jlabel的标签import java.awt.Color;import java.awt.Container;import java.awt.Font;import java.awt.Graphics;import java.awt.Image;import java.awt.event.ActionEvent;import java.aw...
使用table标签制作个人简历
hugo2052的博客
11-04 3081
通过制作个人简历，熟悉table标签的使用 简历
html+table实现注册页面
11-25
初学者实用例子，欢迎大家下载
用table表格标签写注册页面
ginger_mr的博客
03-02 1133
使用table标签写注册页面 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> </head> <body> <!-- 创建十行两列表格--> <table width=...
网站登录注册页面
2301_76272092的博客
07-17 400
数据库可以调用database.php，也可以直接写入登录注册页。数据库名称：hacker。数据库表名：user。
JavaWeb——HTML基础标签table标签与form标签的学习与理解
01-08
使用表格标签制作规整的表格 table标签是表格标签， border属性设置表格的边框厚度， width属性设置表格的宽度， align设置表格的对齐方式， cellspacing设置单元格的间距 tr是行标签， td是单元格标签， th是字体...
HTML 表格标签、列表标签、表单标签（案例： 注册页面）
酷爱前端的小陈博客
04-16 2333
1. 表格标签 表格是实际开发中非常常用的标签: 1. 表格的主要作用 2.表格的基本语法 1.1 表格的主要作用 表格主要用于显示、展示数据，因为它可以让数据显示的非常的规整，可读性非常好。特别是后台展示数据的时候，能够熟练运用表格就显得很重要。一个清爽简约的表格能够把繁杂的数据表现得很有条理。 总结: 表格不是用来布局页面的,而是用来展示数据的。 1.2 表格的基本语法 1. <table> </table> 是用于定义表格的标签。 2. &...
浅谈html table 标签
09-28
HTML中的table标签是用于创建表格的标准标签，它可以让用户在网页上以行和列的形式来排列和展示数据。尽管CSS样式化的表格现在越来越多地用于更复杂的设计，但在数据展示方面，表格标签依然扮演着重要的角色。了解...
案例二：使用表单标签实现注册页面
liupc的学习笔记
03-03 1730
一、需求：实现下面的样式 二、代码 //表单.html <html> <head> <title>注册账号</title> </head...
一个HTML注册页面
11-06
一个很简单的HTML表单提交页面，还可以扩展成将其提交至jsp页面
HTML网页练习之网易邮箱注册页面
12-01
使用HTML+CSS+JavaScript搭建的网易邮箱注册页面，所用代码和素材都已经包含在压缩包中，涉及网页的搭建和客户端对用户名、密码等的格式验证。欢迎大家下载参考
使用 table 和 css 进行页面布局分别制作用户注册内嵌样式方式编写样式
最新发布
09-20
在网页布局中，Table和CSS都是常用的技术来创建用户注册表单的结构和样式。以下是这两种方法的简单说明： **使用HTML Table:** ```html <table border="0" style="width: 100%; max-width: 500px;"> 昵称: <td>...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值