参与css样式表格的注册表单

<head>

	<meta charset="UTF-8" />

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

	<meta http-equiv="X-UA-Compatible" content="ie=edge" />

	<title>注册信息</title>

	<style>

		#info{

			font-size: 20px;

			color: red;

		}

		#sub{

			font-family: "微软雅黑";

			font-size: 25px;

			color: aqua;

		}

		#res{

			font: "arial black";

			font-synthesis: ;

			font-size: 20px;

		}

	</style>

</head>

<body>

	<form action="#" method="post">

		<table align="center" width="700px" height="300px" border="1" cellspacing="" cellpadding="">

			<tr id="info">

				<th colspan="3">填写用户注册信息</th>

			</tr>

			<tr>

				<td>用户名：</td>

				<td width="6px"><input type="text" name="uname" placeholder="请输入名字" /></td>

				<td>登录用户名</td>

			</tr>

			<tr>

				<td>密码：</td>

				<td><input type="password" name="pwd" id="pwd" placeholder="请输入密码" />

					<td>登录密码，6个以上字母数字组合,不区分大小写</td>

			</tr>

			<tr>

				<td>注册邮箱</td>

				<td><input type="text" name="email" id="email" value="" /></td>

				<td>录入后不可修改</td>

			</tr>

			<tr>

				<td>性别</td>

				<td><input type="radio" name="sex" id="sex" value="man" />男<input type="radio" name="sex" id="sex" value="woman" />女 </td>

				<td>选择你的性别</td>

			</tr>

			<tr>

				<td>出生年月</td>

				<td>

					<select name="year">

						<option value="">2003</option>年

						<option>2004</option>

						<option>2005</option>

						<option>2006</option>

					</select>年

					<select name="month">

						<option value="">1</option>年

						<option>2</option>

						<option>3</option>

						<option>4</option>

					</select>月

				</td>

				<td>选择你的出生年月</td>

			</tr>

			<tr>

				<td>兴趣标签</td>

				<td align="center">

					<input type="checkbox" name="" id="" value="" />生活

					<input type="checkbox" name="" id="" value="" />娱乐

					<input type="checkbox" name="" id="" value="" />体育

					<br />

					<input type="checkbox" name="" id="" value="" />财经

					<input type="checkbox" name="" id="" value="" />时尚

					<input type="checkbox" name="" id="" value="" />新闻

				</td>

				<td>选择你感兴趣的标签</td>

			</tr>

			<tr>

				<td>头像</td>

				<td><input type="file" name="head" id="" value="浏览" /></td>

				<td>选取你的头像文件</td>

			</tr>

			<tr>

				<td>个人简介</td>

				<td>

					<textarea name="jieshao " rows="3" cols="30"></textarea>

				</td>

				<td>请添加你的个人简介情况</td>

			</tr>

		</table>

		<br />

		<fieldset>

			<legend>hhh</legend>

			<input type="button" name="" id="" value="表格" />

		</fieldset>

		<p align="center">

		<input  type="reset" name="res" id="res" value="取消" />

		<input  type="submit" name="sub" id="sub" value="提交" />

		</p>

	</form>

</body>


<!DOCTYPE html>

<html lang="zh">

	<head>

		<meta charset="UTF-8" />

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

		<meta http-equiv="X-UA-Compatible" content="ie=edge" />

		<title>注册信息</title>

		<style>

			#info{

				font-size: 20px;

				color: red;

			}

			#sub{

				font-family: "微软雅黑";

				font-size: 25px;

				color: aqua;

			}

			#res{

				font: "arial black";

				font-synthesis: ;

				font-size: 20px;

			}

		</style>

	</head>

	<body>

		<form action="#" method="post">

			<table align="center" width="700px" height="300px" border="1" cellspacing="" cellpadding="">

				<tr id="info">

					<th colspan="3">填写用户注册信息</th>

				</tr>

				<tr>

					<td>用户名：</td>

					<td width="6px"><input type="text" name="uname" placeholder="请输入名字" /></td>

					<td>登录用户名</td>

				</tr>

				<tr>

					<td>密码：</td>

					<td><input type="password" name="pwd" id="pwd" placeholder="请输入密码" />

						<td>登录密码，6个以上字母数字组合,不区分大小写</td>

				</tr>

				<tr>

					<td>注册邮箱</td>

					<td><input type="text" name="email" id="email" value="" /></td>

					<td>录入后不可修改</td>

				</tr>

				<tr>

					<td>性别</td>

					<td><input type="radio" name="sex" id="sex" value="man" />男<input type="radio" name="sex" id="sex" value="woman" />女 </td>

					<td>选择你的性别</td>

				</tr>

				<tr>

					<td>出生年月</td>

					<td>

						<select name="year">

							<option value="">2003</option>年

							<option>2004</option>

							<option>2005</option>

							<option>2006</option>

						</select>年

						<select name="month">

							<option value="">1</option>年

							<option>2</option>

							<option>3</option>

							<option>4</option>

						</select>月

					</td>

					<td>选择你的出生年月</td>

				</tr>

				<tr>

					<td>兴趣标签</td>

					<td align="center">

						<input type="checkbox" name="" id="" value="" />生活

						<input type="checkbox" name="" id="" value="" />娱乐

						<input type="checkbox" name="" id="" value="" />体育

						<br />

						<input type="checkbox" name="" id="" value="" />财经

						<input type="checkbox" name="" id="" value="" />时尚

						<input type="checkbox" name="" id="" value="" />新闻

					</td>

					<td>选择你感兴趣的标签</td>

				</tr>

				<tr>

					<td>头像</td>

					<td><input type="file" name="head" id="" value="浏览" /></td>

					<td>选取你的头像文件</td>

				</tr>

				<tr>

					<td>个人简介</td>

					<td>

						<textarea name="jieshao " rows="3" cols="30"></textarea>

					</td>

					<td>请添加你的个人简介情况</td>

				</tr>

			</table>

			<br />

			<fieldset>

				<legend>hhh</legend>

				<input type="button" name="" id="" value="表格" />

			</fieldset>

			<p align="center">

			<input  type="reset" name="res" id="res" value="取消" />

			<input  type="submit" name="sub" id="sub" value="提交" />

			</p>

		</form>

	</body>

</html>

2018.6.21 css的应用---注册表格的更多相关文章

  1. HTML & CSS & JavaScript 从一个表格到一个灰阶颜色表 01

    工具1:HBuilder X 1.9.9.20190522 工具2:火狐浏览器 67.0.4 (64 位) 在开始之前,你需要了解一些基本的知识,不要求你能掌握,但是了解一下还是有益的: HTML 简 ...

  2. HTML & CSS & JavaScript 从一个表格到一个灰阶颜色表 03

    工具1:HBuilder X 1.9.9.20190522 工具2:火狐浏览器 67.0.4 (64 位) 其实,我还想使用表格,做一个这样的颜色表,如下图所示: 如果按照之前的做法,把每一种颜色都列 ...

  3. HTML & CSS & JavaScript 从一个表格到一个灰阶颜色表 02

    工具1:HBuilder X 1.9.9.20190522 工具2:火狐浏览器 67.0.4 (64 位) 其实,我想使用表格,做一个这样的颜色表,如下图所示: 例 3:我们参照上图,基于上一个例子, ...

  4. HTML & CSS & JavaScript 从一个表格到一个灰阶颜色表 04

    工具1:HBuilder X 1.9.9.20190522 工具2:火狐浏览器 67.0.4 (64 位) 目前,我们已经将一些行和列插入到表格中,并设置单元格的背景颜色,显示 RGB 值等. 例 7 ...

  5. 演示：纯CSS实现自适应布局表格

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

  6. Microsoft Artificial Intelligence Conference（2018.05.21）

    时间:2018.05.21地点:北京嘉丽大酒店

  7. China Intelligent Office Summit（2018.11.21）

    时间:2018.11.21地点:中关村软件园国际会议中心

  8. 2018/8/21 qbxt测试

    2018/8/21 qbxt测试 期望得分:0? 实际得分:0 思路:manacher   会写模板但是不会用 qwq 听了某人的鬼话,直接输出0,然后就gg了 #include <cstdio ...

  9. 范仁义html+css课程---6、表格

    范仁义html+css课程---6.表格 一.总结 一句话总结: 表格中最常用的元素就是table.tr.td.th,还有语义化的thead.tbody.tfoot标签 1.表格构成三个基本要素? t ...

随机推荐

  1. Travelling (三进制+状压dp)

    题目链接 #include <bits/stdc++.h> using namespace std; typedef long long ll; inline ll read(){ ,f= ...

  2. 在使用Vue的过程中安装包的区别

    一:全局包: 用在终端里面 你可以在任何目录下进行安装,安装好了全局包之后,全局包一般安装在 C:/program files/nodejs C:/用户/xxx/App Data/Roaming/np ...

  3. (jmeter内置可调用的变量)jmeter beanShell断言

    用户可以在jmeter- “beanShell断言”中自定义断言.自由灵活的用脚本实现自己的断言  beanShell断言接口介绍  在beanShell中直接可以调用的变量,无需加前缀.  1.lo ...

  4. python入门之进程与线程

    什么是进程.线程 进程:一个整体的形式暴露给操作系统管理,里面包含对各种资源的调用,内存的管理,网络接口的调用等,对各种资源管理的基本单位. 线程:操作系统最小的调度单位, 是一串指令的集合,进程中的 ...

  5. 转 Mindoc搭建流程 文档多人编辑工具。

    安装方法参考: https://www.yuanmas.com/info/1bz9Y126zx.html https://www.iminho.me/version.html #step 1,安装My ...

  6. URAL 1948 H - The Robot on the Line 二分 + 数学

    http://acm.hust.edu.cn/vjudge/contest/126149#problem/H 给定一条二次函数 f (x) = a * x * x + b * x + c 求一个最小的 ...

  7. Have启动报错：java.lang.RuntimeException: Unable to instantiate org.apache.hadoop.hive.ql.metadata.SessionHiveMetaStoreClient

    错误日志如下: [hadoop@master hive1.0.0]$ bin/hive Logging initialized using configuration in file:/opt/mod ...

  8. Java Web项目在Mac系统上启动时提示nodename nor servname provided的解决办法

    今天在Mac系统上启动Java Web项目的时候,提示了Java.net.UnknownHostException: yangxiaomindeMacBook-Pro.local nodename n ...

  9. @b.windows.last.use

    @b.windows.last.use @b.windows.first.use be_true  一般用在step文件中

  10. 《Head First 设计模式》之迭代器与组合模式——遍历合并的菜单

    迭代器与组合模式(Iterator & Composite) 迭代器:提供一种方法顺序访问一个聚合对象中的各个元素,而又不暴露其内部的表示. 组合:允许你将对象组成树形结构来表现“整体.部分” ...