HTML表单制作个人简历

先看在谷歌浏览器中的效果

表单常用标签：

border：设置表格的边框
cellspacing：单元格与单元格之间的距离
bgcolor：表格的背景色
colspan：跨列数
rowspan：跨行数

table>(tr>td*n)*m 可生成一个m行n列的表格
例如生成一个2行3列的表格

HTML代码实现：

<!DOCTYPE html>
<html lang="cn">
<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"><style>/* 设置表格的宽和高，单元格文本框溢出隐藏 */td{width: 100px;overflow: hidden;} tr{height: 35px;}/* 设置输入框的大小沾满整个单元格 */input{border: 0;width: 100%;height: 100%;outline: none;text-align: center;}</style>    <title>resume</title>
</head>
<body><h2 style="text-align: center;">个人简历</h2><form><table border="1" align="center" cellspacing="0"><tbody align="center"><tr><td bgcolor="#ededed">姓名</td><td><input type="text"></td><td bgcolor="#ededed">性别</td><td><input type="text"></td><td bgcolor="#ededed">出生年月</td><td><input type="text"></td><td style="width: 120px;" align="left" rowspan="4"></td></tr><tr><td bgcolor="#ededed">名族</td><td><input type="text"></td><td bgcolor="#ededed">政治面貌</td><td><input type="text"></td><td bgcolor="#ededed">身高</td><td><input type="text"></td></tr><tr><td bgcolor="#ededed">学制</td><td><input type="text"></td><td bgcolor="#ededed">学历</td><td><input type="text"></td><td bgcolor="#ededed">户籍</td><td><input type="text"></td></tr><tr><td bgcolor="#ededed">专业</td><td><input type="text"></td><td colspan="2" bgcolor="#ededed">毕业学校</td><td colspan="2"><input type="text"></td></tr><tr><td colspan="7"><b>技能、特长或爱好</b></td></tr><tr><td bgcolor="#ededed">外语等级</td><td colspan="2"><input type="text"></td><td bgcolor="#ededed">计算机</td><td colspan="3"><input type="text"></td></tr><tr><td colspan="7"><b>个人履历</b></td></tr><tr><td bgcolor="#ededed">时间</td><td colspan="2" bgcolor="#ededed">单位</td><td colspan="4" bgcolor="#ededed">经历</td></tr><tr><td><input type="text"></td><td colspan="2"><input type="text"></td><td colspan="4"><input type="text"></td></tr><tr><td><input type="text"></td><td colspan="2"><input type="text"></td><td colspan="4"><input type="text"></td></tr><tr><td><input type="text"></td><td colspan="2"><input type="text"></td><td colspan="4"><input type="text"></td></tr><tr><td colspan="7"><b>联系方式</b></td></tr><tr><td bgcolor="#ededed">联系电话</td><td colspan="2"><input type="text"></td><td bgcolor="#ededed">通信地址</td><td colspan="3"><input type="text"></td></tr><tr><td bgcolor="#ededed">E-mail</td><td colspan="2"><input type="email"></td><td bgcolor="#ededed">邮编</td><td colspan="3"><input type="text"></td></tr><tr><td colspan="7"><b>自我评价</b></td></tr><tr style="height: 110px;"><td colspan="7"><input type="text"></td></tr></tbody></table></form>
</body>
</html>

HTML表单制作个人简历相关推荐

HTML用＜form＞表单制作个人简历
在HTML表单制作一张个人简介源代码如下: ```html <!DOCTYPE html> <html> <head> <meta charset=&quo ...
利用html表单制作个人简历
制作效果如下所示: 主要实现步骤有: 制作表格: 合并单元格:colspan 是合并列,rowspan是合并行表单的基本属性:form,input 代码如下: <!DOCTYPE html&g ...
html用表单制作个人简历
用表单做一个简单的个人简历,代码如下:(做的有点丑) <!DOCTYPE html> <html lang="en"> <head><me ...
Web 网页求职兼职表单制作
Web 网页求职兼职表单制作 1. 表头 2. 个人信息 3. 求职意向 4. 自我评价 5. 完整代码如下结束语 1. 表头 <!-- align 文字位置 center 居中.left 左 ...
DedeCMS自定义表单制作和调用办法
http://down.chinaz.com/try/201112/1471_1.htm 在很多建站需求中,需要一些额外的表单供前台用户提交,以便于收集.统计.分析及处理更多的数据,比如:在线订单.在 ...
推荐使用什么样的平台表单制作工具好？
在办公自动化迅猛发展的今天,传统的表单制作工具已经不能满足各行各业的生产需求,引用专业的低代码开发平台表单制作工具可以助力企业提高作业协作效率.那么,什么平台的表单制作工具可以实现这一目的?今天,我们 ...
html如何制作一个漂亮的表格？+ 列表制作 + 表单制作（干货！直接收代码）
https://blog.csdn.net/hanhanwanghaha宝藏女孩欢迎您的关注! 欢迎关注微信公众号:宝藏女孩的成长日记如有转载,请注明出处(如不注明,盗者必究) 目录 html如何 ...
mysql 自定义表单_DedeCMS自定义表单制作和调用办法
在很多建站需求中,需要一些额外的表单供前台用户提交,以便于收集.统计.分析及处理更多的数据,比如:在线订单.在线报名等一些常见的互动应用. dedecms自定义表单调用先说怎么调用自定义表单吧,因为 ...
HTML5基础学习（7）：登录表单制作、表单知识补充
一.登录表单制作有的时候用户需要填写信息,然后把填写完的信息交给服务器.把数据提交给服务器的动作就需要一个新的知识点:表单. (1)常见的表单控件大部分的表单控件都是<input>编写 ...

HTML表单制作个人简历

先看在谷歌浏览器中的效果

HTML表单制作个人简历相关推荐

最新文章

热门文章