美文网首页
3.21制作新浪微博资料修改页面(表单)

3.21制作新浪微博资料修改页面(表单)

作者: Tn299 | 来源:发表于2019-03-21 09:56 被阅读0次

题目

  1. 制作新浪微博资料修改页面
    需求说明
    (1) . 生日中各下拉列表默认为空。
    (2) . 常用邮箱文本框中的默认文本为“student@bdqn.cn”,且文本框不可修改。
    (3) . 提交按钮使用素材中提供的图片代替。
    image.png

代码

<body>
<form action="#" method="post">
<table width="835" height="130" cellpadding="0" cellspacing="0" align="center">
  <tr>
   <td><img src="图片素材/logo.png" width="164" height="68" alt="新浪微博"></td>
   <td align="right"><input type="text" name="search"></td>
   <td><img src="图片素材/btn_search.gif" width="53" height="25"></td>
  </tr>
  <tr>
   <td colspan="3"><img src="图片素材/profile_header.jpg" width="760" height="123"></td>
  </tr>
</table>
<table width="400" height="530" cellpadding="0" cellspacing="0" align="center">
 <tr>
   <td align="right">*昵称:</td>
   <td><input type="text" name="username" value=""></td>
   <td></td>
 </tr>
 <tr>
   <td align="right">真实姓名:</td>
   <td><input type="text" name="name" value=""></td>
   <td></td>
 </tr>
 <tr>
   <td align="right">*所在地:</td>
   <td>
    <select name="ads">
    <option value="1" selected="selected">北京市</option>
    </select>
    <select name="adg">
    <option value="1" selected="selected">海淀区</option>
    </select>
   </td>
   <td></td>
 </tr>
 <tr>
   <td align="right">*性别:</td>
   <td>
     <input type="radio" name="sex" value="男">男
     <input type="radio" name="sex" value="女">女
     <input type="radio" name="sex" value="保密">保密
   </td>
   <td></td>
 </tr>
 <tr>
   <td align="right">生日:</td>
   <td>
     <select name="birthday">
      <option value="" selected="selected"></option>
      <option value="1">2000</option>
      <option value="2">2010</option>
     </select>年
     <select name="mon">
      <option value="" selected="selected"></option>
      <option value="1">1</option>
      <option value="2">2</option>
     </select>月
     <select name="birthday">
      <option value="" selected="selected"></option>
      <option value="1">20</option>
      <option value="2">21</option>
     </select>日
   </td>
   <td></td>
 </tr>
 <tr>
  <td align="right">博客地址</td>
  <td><input type="text" name="emali" value=""></td>
  <td></td>
 </tr>
 <tr>
   <td align="right">常用邮箱:</td>
   <td>
    <input type="text" name="ema" value="1332438524@qq.com" disabled="disabled">
   </td>
   <td align="left">不可修改</td>
 </tr>
 <tr>
   <td align="right">QQ:</td>
   <td><input type="text" name="qq" value=""></td>
   <td></td>
 </tr>
 <tr>
   <td align="right">微信:</td>
   <td><input type="text" name="vx" value=""></td>
   <td></td>
 </tr>
 <tr>
   <td align="right">一句话介绍:</td>
   <td colspan="2">
     <textarea name="yjh" cols="25" rows="5"></textarea>
   </td>
 </tr>
 <tr>
   <td align="right"></td>
   <td colspan="2">以下信息,可作为通过客服取回账号的依据 </td>
 </tr>
 <tr>
   <td align="right">证件类型:</td>
   <td>
    <select name="zj">
     <option value="1" selected="selested">身份证</option>
     <option value="2">学生证 </option>
    </select>
   </td>
   <td></td>
 </tr>
 <tr>
   <td align="right">证件号码:</td>
   <td><input type="text" name="num" value=""></td>
   <td></td>
 </tr>
 <tr>
   <td></td>
   <td><input type="image" src="图片素材/btn_save.gif"></td>
   <td></td>
 </tr>
</table>
<table width="835" height="130" cellpadding="0" cellspacing="0" align="center">
 <tr>
   <td>帮助 意见反馈 微博认证及合作 开放平台 微博招聘 新浪网导航 不良信息举报</td>
   <td>新浪公司 版权所有 </td>
 </tr>
 <tr>
   <td>客服电话:400 690 0000 提示音后按1键(按当地市话标准计费)</td>
   <td>
     语言:<select name="lag">
     <option value="1" selected="selected">简体中文</option>
     </select>
   </td>
 </tr>
</table>
</form>
</body>

效果图

image.png

相关文章

网友评论

      本文标题:3.21制作新浪微博资料修改页面(表单)

      本文链接:https://www.haomeiwen.com/subject/mqwfvqtx.html