HTML5练习2
1、邮箱注册网页
主要代码：
<!doctype html> <html> <meta charset="utf-8"> <title>邮箱注册</title> </head> <body> <table align="center"> <tr> <td><img src="images/微博桌面截图_20160519101859_03.gif"><img src="images/微博桌面截图_20160519101859_04.gif"><img src="images/微博桌面截图_20160519101859_05.gif"><img src="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="2" height="30"><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> <label for="*邮箱地址："><font color="red">*</font>邮箱地址：<input type="text" placeholder="建议用手机号码注册" size="34.8" required id="*邮箱地址：" name="*邮箱地址："></label>@ <select size="1"> <option value ="163.com"selected="selected" style="color:#F5F5F5">163.com</option> <option value ="126.com" style="color:#F5F5F5">126.com</option> <option value ="yeah.net" style="color:#F5F5F5">yeah.net</option> </select> <br /> <font color="#CCCCCC" size="-3">6~18个字符，可使用字母、数字、下划线，需以字母开头</font> </form> </td> </tr> <tr> <td> <form> <font color="red">*</font>密码：<input type="password" size="50"> <br /> <font color="#CCCCCC" size="-3">6~16个字符，区分大小写</font> </form> </td> </tr> <tr> <td> <form> <font color="red">*</font>确认密码：<input type="password" size="50"> <br /> <font color="#CCCCCC" size="-3">请再次填写密码</font> </form> </td> </tr> <tr> <td> <form> <font color="red">*</font>手机号码：<label for="phonenumber"><input value="+86" list="phonenumber" size="5"><input type="text" size="39"/></label> <br /> <font color="#CCCCCC" size="-3">忘记密码时，可以通过该手机号码快速找回密码</font> </form> </td> </tr> <tr> <td> <form> <font color="#FF0000">*</font>验证码：<input type="text" size="29"> <img src="images/微博桌面截图_20160519101924_03.gif"> <br /> <font color="#CCCCCC" size="-3">请填写图片中的字符，不区分大小写 看不清楚？换张图片</font> </form> </td> </tr> <tr> <td> <button type="button" onclick="alert('Welcome!')">免费获取验证码</button></td> </tr> <tr> <td> <form> <font color="red">*</font>短信验证码：<input type="text" size="50"> <br /> <font color="#CCCCCC" size="-3">请查收手机短信，并填写短信中的验证码</font> </form> </td> </tr> <tr> <td> <form> <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="1" size="500" align="left"/></td> <td> <img src="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>
结果：
