Html学习之十九（表格与表单学习--邮箱注册页面设计）
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>邮箱注册</title>
<style type="text/css">
h1{
border: 1px solid white;
width: 100%;
height: 50px;
background: lightblue;
color: white;
padding-top: 10px;
font-family: "微软雅黑";
}
.a{
border: 1px solid black;
margin: 0px;
/*background-color: darkgray;*/
font-family: verdana,sans-serif;
font-size: 14px;
padding: 10px;
font-weight: bold;
text-decoration: none;
cursor: default;
text-align: center;
outline: none; }
.txt-tips{
font-family: verdana,sans-serif;
text-align: left;
line-height: 8px;
color: darkgray;
font-size: smaller;
}
.a1,.a2,.a3{
font-weight: bold;
color: black;
cursor: default;
/*display: block;*/
height: 35px;
line-height: 35px;
text-align: center;
font-size: 14px;
outline: none;
list-style: none;
font-family: verdana,sans-serif;
}
.d{
border: solid darkgray 1px;
color: #555;
font-size: 14px;
text-align: left;
font-family: verdana,sans-serif;
line-height: 28px;
}
</style>
</head>
<body>
<form action="#" method="post">
<h1>欢迎注册无限容量的网易云邮箱！邮箱地址可以登录其它网易云旗下产品。</h1>
<br />
<br />
<a tabindex="-1" class="a1" style="text-decoration: none;" onclick="_Global.main.turnOn();return false;" href="#;">
<span class="a">注册字母邮箱</span>
</a>
<a tabindex="-1" class="a2" style="text-decoration: none;" onclick="_Global.main.turnOn(null,'tab');return false;" href="#;">
<span class="a">注册手机号码邮箱</span>
</a>
<a tabindex="-1" class="a3" style="text-decoration: none;" onclick="_Global.main.turnOn();return false;" href="#;">
<span class="a" >注册VIP邮箱</span>
</a>
<br />
<br />
*邮件地址
<input type="email" value="" />@
<select size="1">
<option>163.com</option>
<option>163.com</option>
<option selected="selected">163.com</option>
</select>
<br />
<span class="txt-tips">6~18个字符，可使用字母、数字、下划线，需以字母开头</span>
<br />
<br />
*密码
<input type="password" value=""/>
<br />
<span class="txt-tips">6~16个字符，区分大小写</span>
<br />
<br />
*确认密码
<input type="password" value=""/>
<br />
<span class="txt-tips">请再次填写密码</span>
<br />
<br />
*手机号码
<input type="tel" value=""/>
<br />
<span class="txt-tips">忘记密码时，可以通过该手机号码快速找回密码</span>
<br />
<br />
*验证码
<input type="text" autocomplete="off" value=""/>
<br />
<span class="txt-tips">请填写图中字符，不区分大小写</span>
<br />
<img width="120" height="50"style="cursor: pointer;" alt="验证码" src="../img/call.jpg">
<a tabindex="-1" href="javascript:void(0);">看不清楚？换张图片</a>
<br />
<br />
<span class="d">免费获取验证码</span>
<br />
*短信验证码
<input type="text" autocomplete="off">
<br />
<span class="txt-tips">请查收手机短信，并填写短信中的验证码</span>
<br />
<br />
<input tabindex="-1" type="checkbox" checked="checked">同意
<a tabindex="-1" href="http://reg.163.com/agreement.shtml" target="_blank">"服务条款"</a>和
<a tabindex="-1" href="http://reg.163.com/agreement_game.shtml" target="_blank">"隐私权相关政策"</a>
<br />
<br />
<input type="submit" value="立即注册">
</form>
</body>
</html>
结果：
Html学习之十九（表格与表单学习--邮箱注册页面设计）的更多相关文章
- Html学习之十七（表格与表单学习--排行版制作）
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...
- Html学习之十八（表格与表单学习--统计表制作）
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...
- python运维开发(十九)----Django后台表单验证、session、cookie、model操作
内容目录: Django后台表单验证 CSRF加密传输 session.cookie model数据库操作 Django后台Form表单验证 Django中Form一般有2种功能: 1.用于做用户提交 ...
- html-使用表单标签实现注册页面
案例说明: - 使用表格实现页面效果 - 超链接不想要有效果,使用href="#" - 如果表格里面的单元格没有内容,使用空格作为占位符 - 使用图片标签提交表单 <in ...
- Html学习之十六（表格与表单学习--课程表制作）
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...
- python3.4学习笔记(十九) 同一台机器同时安装 python2.7 和 python3.4的解决方法
python3.4学习笔记(十九) 同一台机器同时安装 python2.7 和 python3.4的解决方法 同一台机器同时安装 python2.7 和 python3.4不会冲突.安装在不同目录,然 ...
- FreeSql （十九）多表查询
多表查询,常用的有联表 LeftJoin/InnerJoin/RightJoin ,这三个方法在上篇文章已经介绍过. 除了联表,还有子查询 Where Exists,和 Select 子表: IFre ...
- 学习笔记：CentOS7学习之十九：Linux网络管理技术
目录 学习笔记:CentOS7学习之十九:Linux网络管理技术 本文用于记录学习体会.心得,兼做笔记使用,方便以后复习总结.内容基本完全参考学神教育教材,图片大多取材自学神教育资料,在此非常感谢MK ...
- 风炫安全web安全学习第二十九节课 CSRF防御措施
风炫安全web安全学习第二十九节课 CSRF防御措施 CSRF防御措施 增加token验证 对关键操作增加token验证,token值必须随机,每次都不一样 关于安全的会话管理(SESSION) 不要 ...
随机推荐
- pip 查看软件包 可用版本并安装； pip 查看 numpy 可用版本并安装
最近需要安装 numpy 的旧版本,发现不知道如何查看可以安装旧版本,解决方法在此进行记录: 然后找到你对应的版本进行安装就可以了: 保持更新,更多精彩内容,请关注 cnblogs.com/xuyao ...
- 微信小程序支付功能讲解(1)
前言:虽然小程序做过很多,但是一直觉得微信支付功能很是神秘,现在终于有机会接触心里还是有点小激动的,经过一番折腾发现支付也不过如此,在此记录下支付功能的实现过程 小程序的官方文档介绍到发起微信支付即调 ...
- deepin/debian 安装docker
简介 Docker 是一个开源的应用容器引擎,让开发者可以打包他们的应用以及依赖包到一个可移植的容器中,然后发布到任何流行的 Linux 机器上,也可以实现虚拟化.容器是完全使用沙箱机制,相互之间不会 ...
- acWing 825. 排队购物
题目描述苏西小朋友和她的妈妈正在超市里购物,看着收银处排着的长长的队伍,她就想如何能够提高整体的服务质量呢? 已知,现在有n个人正在排队等待结账,每个人结账所花的时间都可能是不同的,第 i 个人的结账 ...
- 解决VirtualBox虚拟机中PM3总是自动断开的问题
一.问题 运行环境: 虚拟机软件:VirtualBox 6.0.8 r130520 宿主机:Win10 1803 客户机:Ubuntu 19.04 问题: 当插入PM3并连入虚拟机后,PM3过几十秒会 ...
- 2019 SDN上机第6次作业
2019 SDN上机第6次作业 1.实验拓扑 (1)实验拓扑 (2)使用Python脚本完成拓扑搭建 from mininet.topo import Topo from mininet.net im ...
- MySQL数据库实战之优酷
目录 一.项目总结三步骤 二.项目需求分析 三.搭建框架 四.ORM框架分析 五.数据库设计 六.项目中各个功能模块分析 七.项目中遇到的问题及怎么解决的 八.客户端代码框架 8.1 conf 8.1 ...
- golang数据结构之选择排序
//SelectSort 选择排序 func SelectSort(arr *[]int) { ; i < len(arr); i++ { tmp := arr[i] index := i ; ...
- 如何将Javaweb工程的访问协议由http改为https及通过域名访问?
将javaweb工程的http访问协议更改为https,需要做一下几部操作: 通过jre生成证书 调整tomcat的配置 调整工程的web.xm配置 具体详细过程如下: 一.生成证书 打开cmd切换到 ...
- 基于 HTML5 WebGL 构建智能城市 3D 场景
前言 随着城市规模的扩大,传统的方式很难彻底地展示城市的全貌,但随着 3D 技术的应用,出现了 3D 城市群的方式以动态,交互式地把城市全貌呈现出来.配合智能城市系统,通过 Web 可视化的方式,使得 ...