1、邮箱注册网页

主要代码:

<!doctype html>
<html>
<meta charset="utf-8">
<title>邮箱注册</title>
</head> <body>
<table align="center">
<tr>
<td><img src="data:images/微博桌面截图_20160519101859_03.gif"><img src="data:images/微博桌面截图_20160519101859_04.gif"><img src="data:images/微博桌面截图_20160519101859_05.gif"><img src="data:images/微博桌面截图_20160519101859_07.gif"></td>
<td align="right"><font color="#3300FF" size="-2"><a href="http://mail.163.com/html/mail_intro/" target="_blank">了解更多</a> | <a href="http://help.mail.163.com/feedback.do?m=add&categoryName=注册" target="_blank">反馈意见</a></font></td>
</tr> <tr bgcolor="#6697C9">
<td colspan="" height=""><font face="隶书" size="+1" color="#FFFFFF"><b>欢迎注册无限容量的网易邮箱!邮件地址可以登录使用其他网易旗下产品。</b></font></td>
</tr> <tr>
<td>
<div>
<table>
<tr>
<td><input type="button" value="注册字母邮箱"></td>
</tr> <tr>
<td>
<form>
&nbsp;&nbsp;<label for="*邮箱地址:"><font color="red">*</font>邮箱地址:<input type="text" placeholder="建议用手机号码注册" size="34.8" required id="*邮箱地址:" name="*邮箱地址:"></label>@
<select size="">
<option value ="163.com"selected="selected" style="color:#F5F5F5">.com</option>
<option value ="126.com" style="color:#F5F5F5">.com</option>
<option value ="yeah.net" style="color:#F5F5F5">yeah.net</option>
</select>
<br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<font color="#CCCCCC" size="-3">~18个字符,可使用字母、数字、下划线,需以字母开头</font>
</form>
</td>
</tr> <tr>
<td>
<form>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<font color="red">*</font>密码:<input type="password" size="">
<br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<font color="#CCCCCC" size="-3">~16个字符,区分大小写</font>
</form>
</td>
</tr> <tr>
<td>
<form>
&nbsp;&nbsp;<font color="red">*</font>确认密码:<input type="password" size="">
<br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<font color="#CCCCCC" size="-3">请再次填写密码</font>
</form>
</td>
</tr> <tr>
<td>
<form>
&nbsp;&nbsp;<font color="red">*</font>手机号码:<label for="phonenumber"><input value="+86" list="phonenumber" size=""><input type="text" size=""/></label>
<br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<font color="#CCCCCC" size="-3">忘记密码时,可以通过该手机号码快速找回密码</font>
</form>
</td>
</tr> <tr>
<td>
<form>
&nbsp;&nbsp;&nbsp;&nbsp;<font color="#FF0000">*</font>验证码:<input type="text" size="">&nbsp;<img src="data:images/微博桌面截图_20160519101924_03.gif">
<br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<font color="#CCCCCC" size="-3">请填写图片中的字符,不区分大小写&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;看不清楚?换张图片</font>
</form>
</td>
</tr> <tr>
<td>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<button type="button" onclick="alert('Welcome!')">免费获取验证码</button></td>
</tr> <tr>
<td>
<form>
<font color="red">*</font>短信验证码:<input type="text" size="">&nbsp;
<br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<font color="#CCCCCC" size="-3">请查收手机短信,并填写短信中的验证码</font>
</form>
</td>
</tr> <tr>
<td>
<form>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<font size="-1"><input type="checkbox">同意<a href="http://reg.163.com/agreement.shtml" target="_blank">"服务条款"</a>和<a href="http://reg.163.com/agreement_game.shtml" target="_blank">"隐私权相关政策"</a></font>
</form>
</td>
</tr> <tr>
<td><center><p><form><a href="http://hwwebmail.mail.163.com/js6/main.jsp?sid=SBkCOwLCmHqieLRiJACCTSeUMjEbIWlZ&df=unknow#module=welcome.WelcomeModule%7C%7B%7D" target="_blank"><input type="submit" value="立即注册"></a></form></p></td>
</tr>
</table>
</div>
</td> <td>
<table background="未标题-1.jpg">
<td><hr width="" size="" align="left"/></td>
<td>
<img src="data:images/微博桌面截图_20160519101859_12.gif"><br />
<form>
<center><font size="-1" color="#6697C9"><input type="checkbox">同时管理所有邮箱<br /><input type="checkbox">随时随地免费收发</font>
</form></center>
</td>
</table>
</td>
</tr> </table>
<datalist id="phonenumber">
<option value="+86" label="中国"/>
<option value="+1">美国</option>
<option value="+852" label="香港"/>
</datalist>
</body>
</html>

结果:

HTML5练习2的更多相关文章

  1. 使用HTML5开发Kinect体感游戏

    一.简介 我们要做的是怎样一款游戏? 在前不久成都TGC2016展会上,我们开发了一款<火影忍者手游>的体感游戏,主要模拟手游章节<九尾袭来 >,用户化身四代,与九尾进行对决, ...

  2. 读书笔记:《HTML5开发手册》--HTML5新的结构元素

    读书笔记:<HTML5开发手册> (HTML5 Developer's CookBook) 虽然从事前端开发已有很长一段时间,对HTML5标签也有使用,但在语义化上面理解还不够清晰.之前在 ...

  3. HTML5 Boilerplate - 让页面有个好的开始

    最近看到了HTML5 Boilerplate模版,系统的学习与了解了一下.在各种CSS库.JS框架层出不穷的今天,能看到这么好的HTML模版,感觉甚爽.写篇博客,推荐给大家使用.   一:HTML5 ...

  4. 戏说HTML5

    如果有非技术人员问你,HTML5是什么,你会怎么回答? 新的HTML规范... 给浏览器提供了牛逼能力,干以前不能干的事...(确切地说应该是给浏览器规定了许多新的接口标准,要求浏览器实现牛逼的功能. ...

  5. nw.js桌面软件开发系列 第0.1节 HTML5和桌面软件开发的碰撞

    第0.1节 HTML5和桌面软件开发的碰撞 当我们谈论桌面软件开发技术的时候,你会想到什么?如果不对技术本身进行更为深入的探讨,在我的世界里,有这么多技术概念可以被罗列出来(请原谅我本质上是一个Win ...

  6. Web大前端时代之:HTML5+CSS3入门系列

    准备来一波新技术,待续.... Old: 联系源码:https://github.com/dunitian/LoTHTML5 文档下载:https://github.com/dunitian/LoTD ...

  7. 07. Web大前端时代之:HTML5+CSS3入门系列~H5 地理位置

    Web大前端时代之:HTML5+CSS3入门系列:http://www.cnblogs.com/dunitian/p/5121725.html 源码:https://github.com/duniti ...

  8. HTML5 介绍

    本篇主要介绍HTML5规范的内容和页面上的架构变动. 目录 1. HTML5介绍 1.1 介绍 1.2 内容 1.3 浏览器支持情况 2. 创建HTML5页面 2.1 <!DOCTYPE> ...

  9. HTML5 语义元素(一)页面结构

    本篇主要介绍HTML5增加的语义元素中关于页面结构方面的,包含: <article>.<aside>.<figure>.<figcaption>.< ...

  10. HTML5 input元素新的特性

    在HTML5中,<input>元素增加了许多新的属性.方法及控件.本文章分别对这三方面进行介绍. 目录 1. 属性 2. 方法 3. 新控件 1. 属性 <input>元素在H ...

随机推荐

  1. poj 3294 后缀数组 多字符串中不小于 k 个字符串中的最长子串

    Life Forms Time Limit: 5000MS   Memory Limit: 65536K Total Submissions: 16223   Accepted: 4763 Descr ...

  2. etcd3集群管理

    目录 在什么情况下需要集群的运行时更改 集群运行时更改的操作 更新一个节点 删除一个节点 增加一个节点 节点迁移和灾难恢复 迁移节点 灾难恢复 在什么情况下需要集群的运行时更改 维护和升级多个机器 如 ...

  3. Kubernetes Deloyment实现滚动更新

    目录 滚动更新简介 使用kubectl rolling-update更新RC Deployment的rolling-update 滚动更新简介 当kubernetes集群中的某个服务需要升级时,传统的 ...

  4. P1077 摆花

    P1077 摆花 题目描述 小明的花店新开张,为了吸引顾客,他想在花店的门口摆上一排花,共 m 盆.通过调查顾客的喜好,小明列出了顾客最喜欢的 n 种花,从 1 到 n 标号.为了在门口展出更多种花, ...

  5. sys模块python

    sys模块 1: sys是python自带模块. 利用 import 语句输入sys 模块. 当执行import sys后, python在 sys.path 变量中所列目录中寻找 sys 模块文件. ...

  6. Hadoop基础-Idea打包详解之手动添加依赖(SequenceFile的压缩编解码器案例)

    Hadoop基础-Idea打包详解之手动添加依赖(SequenceFile的压缩编解码器案例) 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 一.编辑配置文件(pml.xml)(我 ...

  7. [Web] Web请求过程之一:HTTP

    请求过程: 1.用户在浏览器输入 www.sdjtu.edu.cn 这个URL. 2.浏览器请求 DNS 服务器将这个 URL 解析成对应的 IP 地址. 3.浏览器向 IP 地址对应的这个服务器发起 ...

  8. bzoj千题计划160:bzoj2599: [IOI2011]Race

    http://www.lydsy.com/JudgeOnline/problem.php?id=2599 点分治 mi[i] 记录边权和为i时的最少边数 先更新答案,再更新mi数组,换根时清空mi # ...

  9. Linux根目录解析

    根目录结构如下: 1. / - 根目录: 每一个文件和目录都从这里开始. 只有root用户具有该目录下的写权限.此目录和/root目录不同,/root目录是root用户的主目录. 2. /bin - ...

  10. [Luogu 3128] USACO15DEC Max Flow

    [Luogu 3128] USACO15DEC Max Flow 最近跟 LCA 干上了- 树剖好啊,我再也不想写倍增了. 以及似乎成功转成了空格选手 qwq. 对于每两个点 S and T,求一下 ...