html&css实现阿里巴巴注册界面

来源：互联网发布：淘宝平均停留时间编辑：程序博客网时间：2024/06/12 01:37

暑期实训第二个任务：

1.使用HTML5创建一个阿里巴巴的注册界面，表单和表格的使用。

想要最终的效果，环境：hbuilder。

布局：

先分为上（20%）中（60%）下（20%）三部分。为了实现中间部分对齐，将中间部分又分为了8*2的表格。

最终想要的效果：

代码如下：

<html><head><meta charset="utf-8"><title>alibaba register page</title></head><body><table  width="100%" height="100%" align="middle"><tr><!--行--><td height="20%"><table  height="100%" width="100%"><tr><td><img src="header.jpg" /></td></tr></table></td> <!--一个格子--></tr><tr><!--行--><td height="60%" align="middle"><table height="100%" width="100%"><tr><td align="right">电子邮箱：</td><td align="left"><input type="text" /></td></tr><tr><td align="right">会员登录名：</td><td align="left"><input type="text" /></td></tr><tr><td align="right">密码：</td><td align="left"><input type="password" /></td></tr><tr><td align="right">再次输入密码：</td><td align="left"><input type="password" /></td></tr><tr><td align="right">会员身份：</td><td align="left"><input type="radio" name="模式" />买家<input type="radio" name="模式" />卖家<input type="radio" name="模式" />两者都是</td></tr><tr><td align="right"><br /><br /> 验证码：</td><td align="left"><input type="text" /><img src="verycode.gif" />看不清？换一张</td></tr><tr><td align="right"></td><td align="left"><img src="btn_reg.gif" /></td></tr><tr><td align="right"></td><td align="left"><textarea cols="90" row="100">欢迎阅读阿里巴巴公司（阿里巴巴）服务条款协议(下称"本协议")，您应当在使用服务之前认真阅读本协议全部内容，且对本协议中加粗字体显示的内容，阿里巴巴督促您应重点阅读。本协议阐述之条款和条件适用于您使用阿里巴巴中文网站（所涉域名为：Alibaba.com.cn、alibaba.cn、1688.com，下同），所提供的在全球企业间(B-TO-B)电子市场(e-market)中进行贸易和交流的各种工具和服务(下称"服务")。 </textarea></td></tr></table><tr><td height="20%"><img src="footer.jpg" /></td> <!--一个格子--></tr></table></body></html>

阅读全文

0 0