table制作简历和form简单用户注册
程序员文章站
2022-03-07 19:29:18
...
table制作简历
浏览效果
代码如下
<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>table制作简历</title><style>body{text-align: center;}table{width: 700px;height: auto;margin: auto;}tr th{height: 30px;}.yan{background: #ccf;}tr td{width: 100px;height: 20px;}.s{height: 40px;}</style></head><body><table border="1" cellpadding="0" cellspacing="0"><tr><th class="yan" colspan="7">个人基本资料</th></tr><tr><td>姓名</td><td></td><td>性别</td><td></td><td>民族</td><td></td><td rowspan="4">照片</td></tr><tr><td>籍贯</td><td colspan="2"></td><td>政治面貌</td><td colspan="2"></td></tr><tr><td>学校</td><td></td><td>学历</td><td></td><td>专业</td><td></td></tr><tr><td>身高</td><td></td><td>体重</td><td></td><td>联系电话</td><td></td></tr><tr><th class="yan" colspan="7">求职意向</th></tr><tr><td>行业</td><td colspan="6"></td></tr><tr><td>目标岗位</td><td colspan="6"></td></tr><tr><td>工作性质</td><td colspan="3"></td><td>任职时间</td><td colspan="2"></td></tr><tr><td>月薪期望</td><td colspan="3"></td><td>工作地点</td><td colspan="2"></td></tr><tr><td>相关说明</td><td colspan="6"></td></tr><tr><th class="yan" colspan="7">教育背景</th></tr><tr><td>开始时间</td><td>结束时间</td><td colspan="2">学校</td><td colspan="3">相关说明</td></tr><tr><td></td><td></td><td colspan="2"></td><td colspan="3"></td></tr><tr><td></td><td></td><td colspan="2"></td><td colspan="3"></td></tr><tr><td></td><td></td><td colspan="2"></td><td colspan="3"></td></tr><tr><td>最高学历</td><td colspan="2"></td><td>选修专业</td><td colspan="3"></td></tr><tr><td>所学专业</td><td colspan="6"></td></tr><tr><td>个人技能</td><td colspan="6"></td></tr><tr><td>奖项正是</td><td colspan="6"></td></tr><tr><td>语言能力</td><td></td><td>国语水平</td><td></td><td>其他语言</td><td colspan="2"></td></tr><tr><th class="yan" colspan="7">自我评价</th></tr><tr><td>兴趣和特长</td><td colspan="6"></td></tr><tr class="s"><td>获奖情况</td><td colspan="6"></td></tr><tr class="s"><td>个人评价</td><td colspan="6"></td></tr></table></body></html>
form简单用户注册
浏览效果
代码如下
<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>form编写用户注册</title><style>.box{width: 600px;height: auto;margin: auto;background: cornsilk;}h3{text-align: center;}</style></head><body><div class="box"><h3>用户注册</h3><form action="" method=""><div>账号: <input type="text" name="user_name" placeholder="不超过八个字符"></div><div>密码: <input type="password" name="pwd" placeholder="6-16个字符"></div><div>邮箱: <input type="email" name="email" placeholder="example@mail.com"></div><div>生日: <input type="date" name="birthday"></div><div>课程:<select name="kecheng"><option value="h5" selected>HTML5</option><option value="c3">CSS3</option><option value="js">javascript</option><option value="php">PHP</option><option value="java">java</option></select></div><div>爱好:<label><input type="checkbox" value="game"> 玩游戏</label><label><input type="checkbox" value="video"> 旅游</label><label><input type="checkbox" value="code"> 打代码</label><label><input type="checkbox" value="code"> 看书看电影</label></div><div>性别:<label><input type="radio" name="sex" value="1">男</label><label><input type="radio" name="sex" value="2">女</label><label><input type="radio" name="sex" value="0" checked>保密</label></div><div><div>简介:</div><textarea rows="10" cols="40" name="desc"></textarea></div><input type="submit" value="提交"><input type="button" value="取消"></form></div></body></html></body></html>