TFH.001 - 课堂小测验:登录页面


9月29日测试#

Bruce_Zhu于2016.9.29


  • 测试需要做一个如下图的页面
QQ截图20160929181430.png

  • 代码如下

<pre>

<!doctype html>
<html lang="en">

<head>
<meta charset="UTF-8">
<meta name="Author" content="Bruce Zhu">
<title>有京东,有刘强东</title>
</head>

<body>

<img src="JDLogo.png" width="150px" height="65px" style="float:left"><br>
   <h2>欢迎登录</h2>

 <table border="1px" cellspacing="0px" cellpadding="2px" align="center">

   <tr>
     <td rowspan="8" width="390px">
       <img src="AD.jpg" style="float:left">
     </td>
     <td width="280px">用户名/邮箱:</td>
   </tr>

   <tr>
     <td>
       <input type="text" value="mary@163.com" style="width:200px">
     </td>
   </tr>

   <tr>
   <td>密码:</td>
   </tr>

   <tr>
     <td>
       <input type="password" style="width:200px">
     </td>
   </tr>

   <tr>
     <td>
       <input type="checkbox" value="login">自动登录
     </td>
   </tr>

   <tr>
     <td align="center">
       <input type="submit" value="登录">
       <input type="reset" value="重填">
     </td>
   </tr>

   <tr>
     <td>使用京东合作账号登录</td>
   </tr>

   <tr>
     <td align="right">
       <input type="radio" value="QQ">QQ
       <input type="radio" value="JD">京东钱包
     </td>
   </tr>

   <tr>
     <td colspan="2" align="right">
       <input type="submit" value="免费注册>>">
     </td>
   </tr>

  </table><br><br>

  <div align="center">
      <span><a href="http://www.baidu.com">关于我们</a></span>丨
      <span><a href="http://www.xiaomi.com">联系我们</a></span>丨
      <span><a href="http://www.apple.com">人才招聘</a></span>丨 
      <span><a href="http://www.sina.com">商家入驻</a></span>丨 
      <span><a href="http://www.qq.com">广告服务</a></span>
 </div> 

</body>

</html>

</pre>

推荐阅读更多精彩内容