2018.6.21 css的应用---注册表格
参与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的应用---注册表格的更多相关文章
- HTML & CSS & JavaScript 从一个表格到一个灰阶颜色表 01
工具1:HBuilder X 1.9.9.20190522 工具2:火狐浏览器 67.0.4 (64 位) 在开始之前,你需要了解一些基本的知识,不要求你能掌握,但是了解一下还是有益的: HTML 简 ...
- HTML & CSS & JavaScript 从一个表格到一个灰阶颜色表 03
工具1:HBuilder X 1.9.9.20190522 工具2:火狐浏览器 67.0.4 (64 位) 其实,我还想使用表格,做一个这样的颜色表,如下图所示: 如果按照之前的做法,把每一种颜色都列 ...
- HTML & CSS & JavaScript 从一个表格到一个灰阶颜色表 02
工具1:HBuilder X 1.9.9.20190522 工具2:火狐浏览器 67.0.4 (64 位) 其实,我想使用表格,做一个这样的颜色表,如下图所示: 例 3:我们参照上图,基于上一个例子, ...
- HTML & CSS & JavaScript 从一个表格到一个灰阶颜色表 04
工具1:HBuilder X 1.9.9.20190522 工具2:火狐浏览器 67.0.4 (64 位) 目前,我们已经将一些行和列插入到表格中,并设置单元格的背景颜色,显示 RGB 值等. 例 7 ...
- 演示：纯CSS实现自适应布局表格
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...
- Microsoft Artificial Intelligence Conference（2018.05.21）
时间:2018.05.21地点:北京嘉丽大酒店
- China Intelligent Office Summit（2018.11.21）
时间:2018.11.21地点:中关村软件园国际会议中心
- 2018/8/21 qbxt测试
2018/8/21 qbxt测试 期望得分:0? 实际得分:0 思路:manacher 会写模板但是不会用 qwq 听了某人的鬼话,直接输出0,然后就gg了 #include <cstdio ...
- 范仁义html+css课程---6、表格
范仁义html+css课程---6.表格 一.总结 一句话总结: 表格中最常用的元素就是table.tr.td.th,还有语义化的thead.tbody.tfoot标签 1.表格构成三个基本要素? t ...
随机推荐
- 深入理解Java虚拟机 学习总结
一.运行时数据区域 Java虚拟机管理的内存包括几个运行时数据内存:方法区.虚拟机栈.本地方法栈.堆.程序计数器,其中方法区和堆是由线程共享的数据区,其他几个是线程隔离的数据区 1.1 程序计数器 程 ...
- Intervals POJ - 1201 差分约束
You are given n closed, integer intervals [ai, bi] and n integers c1, ..., cn. Write a program that: ...
- sql 查找重复数据，并且重复数据有子集
SELECT A.* FROM comm_department A INNER JOIN ( select path,count(*) as count from comm_department gr ...
- js 设置 cookie
function setCookie(name,value){ var Days = 30; var exp = new Date(); exp.setTime(exp.getTime() + Day ...
- luogu P5142 区间方差 十分优美的线段树
又来了个维护方差的线段树.... 大致推导过程(字丑多包涵QAQ) 注意取模时要加一些100000007防止出现负数.. #include<cstdio> #include<iost ...
- 练习十六：Python日期格式应用（datetime）
练习:关于python日期格式应用练习.用python方法如何输出指定格式形式的日期 这里用到datetime模块,datetime模块重新封装了time模块,提供了更多接口,提供的类包括:date, ...
- 配置Spring发送邮件
推荐查看原博客 转载自:配置Spring发送邮件 Spring Email抽象的核心是MailSender接口.顾名思义,MailSender的实现能够通过连接Email服务器实现邮件发 ...
- SpringBoot | 第二十一章：异步开发之异步调用
前言 上一章节,我们知道了如何进行异步请求的处理.除了异步请求,一般上我们用的比较多的应该是异步调用.通常在开发过程中,会遇到一个方法是和实际业务无关的,没有紧密性的.比如记录日志信息等业务.这个时候 ...
- 小程序的switch组件
小程序的switch开关组件,总结下大概有三种使用场景. 其一: 纯展示场景, 用来展示某个开关值是打开还是关闭的,这个场景比较简单,给个disabled属性就ok了: 其二: 用户点击后立即切换开关 ...
- 开始使用JQuery 方法
使用jQuery需要3个基本步骤: 1. 下载jQuery.js并保存在网页可以存取的位置.下载链接:dowload 2. 在HTML的head里引用jQuery.js 3. 运用jQuery的方法 ...