HTML开发实例-简单相亲网站开发(主体为table)
2020-05-27 16:00:59来源:博客园 阅读 ()
HTML开发实例-简单相亲网站开发(主体为table)
实现功能:简单的相亲网站:
清楚不常在,抓紧谈恋爱
我承诺
- 年满十八岁
- 单身
- 抱着严肃态度
- 寻找真诚的另一半
性别: | |
生日: | |
所在区域 | |
婚姻状况 | |
学历 | |
喜欢的类型 | 妩媚的 可爱的 小鲜肉 老腊肉 都喜欢 |
自我介绍 | |
我同意注册条款和会员 | |
我是会员立即登录 |
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <meta name="viewport" content="width=device-width, initial-scale=1.0"> 6 <title>Document</title> 7 </head> 8 <body> 9 <h4>清楚不常在,抓紧谈恋爱</h4> 10 <table> 11 <!-- 第一行 --> 12 <tr> 13 <td>性别:</td><br /> 14 <td><input type="radio" id="nan" name="sex"> <label for="nan">男</label> 15 <input type="radio" id="nv" name="sex"> <label for="nv">女</label> 16 </td><br> 17 </tr> 18 <!-- 第二行 --> 19 <tr> 20 <td> 21 生日: 22 </td> 23 <td> 24 <select> 25 <option checked="checked">--请选择年--</option> 26 <option>2019</option> 27 <option>2020</option> 28 <option>2021</option> 29 </select> 30 31 <select> 32 <option checked="checked">--请选择月--</option> 33 <option>1</option> 34 <option>2</option> 35 <option>3</option> 36 </select> 37 38 <select> 39 <option checked="checked">--请选择日--</option> 40 <option>1</option> 41 <option>2</option> 42 <option>3</option> 43 </select> 44 45 </td> 46 </tr> 47 <!-- 第三行 --> 48 <tr> 49 <td>所在区域</td> 50 <td> 51 <input type="text" value="北京思密达"> 52 </td> 53 </tr> 54 <!-- 第四行 --> 55 <tr> 56 <td>婚姻状况</td> 57 <td> 58 <input type="radio" id="weihun" name="hunyin"><label for="weihun">未婚</label> 59 <input type="radio" name="hunyin"> <label>已婚</label> 60 <input type="radio" name="hunyin" checked="checked"> <label>离婚</label> 61 </td> 62 </tr> 63 <!-- 学历 --> 64 <tr> 65 <td>学历</td> 66 <td><input type="text" value="博士后"></td> 67 </tr> 68 <!-- 喜欢的类型 --> 69 <tr> 70 <td>喜欢的类型</td> 71 <td> 72 <input type="checkbox" name="xingge">妩媚的 73 <input type="checkbox" name="xingge">可爱的 74 <input type="checkbox" name="xingge">小鲜肉 75 <input type="checkbox" name="xingge">老腊肉 76 <input type="checkbox" name="xingge">都喜欢 77 </td> 78 </tr> 79 <!-- 自我介绍 --> 80 <tr> 81 <td>自我介绍</td> 82 <td><textarea>个人简介</textarea></td> 83 </tr> 84 <!-- 免费注册 --> 85 <tr> 86 <td></td> 87 <td><input type="submit" value="免费注册"></td> 88 </tr> 89 <!-- checkbox --> 90 <tr> 91 <td> 92 <td><input type="checkbox">我同意注册条款和会员</td> 93 </tr> 94 <tr> 95 <td></td> 96 <td><a href="#">我是会员立即登录</a></td> 97 </tr> 98 <td></td> 99 <td> 100 <h5>我承诺</h5> 101 <ul> 102 <li>年满十八岁</li> 103 <li>单身</li> 104 <li>抱着严肃态度</li> 105 <li>寻找真诚的另一半</li> 106 107 </ul> 108 </td> 109 </tr> 110 </table> 111 </body> 112 </html>
原文链接:https://www.cnblogs.com/qiujie-prion/p/12964182.html
如有疑问请与原作者联系
标签:
版权申明:本站文章部分自网络,如有侵权,请联系:west999com@outlook.com
特别注意:本站所有转载文章言论不代表本站观点,本站所提供的摄影照片,插画,设计作品,如需使用,请与原作者联系,版权归原作者所有
上一篇:HTML表单标签
下一篇:CSS基础选择器总结
- DIV居中的经典方法 2020-06-13
- Html/css 列表项 区分列表首尾 2020-06-11
- HTML骨架 2020-06-10
- HTML基础教程_1 2020-06-09
- HTML基础02 2020-06-09
IDC资讯: 主机资讯 注册资讯 托管资讯 vps资讯 网站建设
网站运营: 建站经验 策划盈利 搜索优化 网站推广 免费资源
网络编程: Asp.Net编程 Asp编程 Php编程 Xml编程 Access Mssql Mysql 其它
服务器技术: Web服务器 Ftp服务器 Mail服务器 Dns服务器 安全防护
软件技巧: 其它软件 Word Excel Powerpoint Ghost Vista QQ空间 QQ FlashGet 迅雷
网页制作: FrontPages Dreamweaver Javascript css photoshop fireworks Flash