html（rowspan、colspan）练习-webstorm个人电子简历制作

html练习-webstorm个人电子简历制作`

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>个人简历</title><style type="text/css">td {border:1px solid black;text-align: center;height: 40px;}table{width: 800px;border-collapse:collapse;}.table1{border-collapse: collapse;border-width:0px;border-top-style:hidden;}</style >
</head>
<body>
<h2 style="width: 800px;text-align:center;">个人简历</h2>
<table ><!--<tr style="align: center;font-size: 30px;width: 800px"><th width="800px" align="center">个人简历</th></tr>--><tr><td style="width: 100px">姓名</td><td style="width: 100px"></td><td style="width: 100px">性别</td><td style="width: 100px"></td><td style="width: 100px">民族</td><td style="width: 100px"></td><td width="200px" rowspan="4"></td></tr><tr><td style="width: 100px">政治面貌</td><td style="width: 100px"></td><td style="width: 100px">出生年月</td><td style="width: 100px"></td><td style="width: 100px">婚姻情况</td><td style="width: 100px"></td></tr><tr><td style="width: 100px">籍贯</td><td style="width: 100px"></td><td style="width: 100px">现所在地</td><td style="width: 100px"></td><td style="width: 100px">学历</td><td style="width: 100px"></td></tr><tr ><td style="width: 100px">毕业院校</td><td width="100px" colspan="2"></td><td style="width: 100px">专业</td><td width="100px" colspan="2"></td></tr><table class="table1"><tr ><td style="width: 100px">电子邮箱</td><td style="width: 280px"></td><td style="width: 100px">联系电话</td><td style="width: 330px"></td></tr><tr ><td style="width: 100px">语言能力</td><td style="width: 280px"></td><td style="width: 100px">计算机能力</td><td style="width: 330px"></td></tr><tr ><td style="width: 100px">其他技能</td><td style="width: 280px"></td><td style="width: 100px">爱好特长</td><td style="width: 330px"></td></tr><tr><td style="width: 100px">求职意向</td><td  colspan="3"></td></tr></table><table class="table1"><tr ><td width="40px" rowspan="5">教育培训经历</td><td style="width: 100px">时间</td><td style="width: 180px">毕业学校/培训机构</td><td style="width: 360px">专业/主要培训机构</td><td style="width: 160px">学历/证书</td></tr><tr ><td style="width: 100px"></td><td style="width: 180px"></td><td style="width: 360px"></td><td style="width: 160px"></td></tr><tr ><td style="width: 100px"></td><td style="width: 180px"></td><td style="width: 360px"></td><td style="width: 160px"></td></tr><tr ><td style="width: 100px"></td><td style="width: 180px"></td><td style="width: 360px"></td><td style="width: 160px"></td></tr><tr ><td style="width: 100px"></td><td style="width: 180px"></td><td style="width: 360px"></td><td style="width: 160px"></td></tr><tr ><td width="40px" rowspan="5">工作简历</td><td style="width: 100px">时间</td><td style="width: 180px">在何单位</td><td style="width: 360px">具体岗位/职责</td><td style="width: 160px">离职原因</td></tr><tr ><td style="width: 100px"></td><td style="width: 180px"></td><td style="width: 360px"></td><td style="width: 160px"></td></tr><tr ><td style="width: 100px"></td><td style="width: 180px"></td><td style="width: 360px"></td><td style="width: 160px"></td></tr><tr ><td style="width: 100px"></td><td style="width: 180px"></td><td style="width: 360px"></td><td style="width: 160px"></td></tr></table><table class="table1"><tr ><td style="width: 100px">获奖情况</td><td style="width: 700px"></td></tr><tr ><td style="width: 100px">自我评价</td><td style="width: 700px"></td></tr><tr ><td style="width: 100px">专业技能</td><td style="width: 700px"></td></tr></table>
</table></body>
</html>

主要练习了colspan和rowspan的用法
分清了align和text-align的用法区别
table之间的间隔消除可用border-collapse:collapse;属性来代替cellspacing=“0”
table之间的边框重叠可将border-top（left、right、bottom）-style设为none消除

html（rowspan、colspan）练习-webstorm个人电子简历制作相关推荐

wps如何自己制作流程图_WPS小技巧——如何制作炫酷的个性电子简历
大家好,上期内容我们介绍了一个在Word文档中,快速改变顺序排列的小技巧,那今天,再来给大家分享一个利用Excel快速制作电子简历的实用方法吧~ 首先,选中部分空白单元格,然后给它添加一个外边框来粗化 ...
谷歌浏览器table不规则表格使用rowspan/colspan导致线条粗细不同
背景希望制作一张表格, 如下图, 但使用rowspan/colspan后导致绘制的表格线条重叠, 导致有些线条粗有些线条细. ps: 只有使用谷歌浏览器时有这个问题, 使用火狐等浏览器时线条显示均正 ...
【项目难点】使用canvas完成电子简历功能
要求能够实现将个人照片.信息,展示到小程序页面中,并可以导出.但是因为后端没有一个单独的图片服务器,并且图片是以一个blob对象捎带在响应数据中的,因此还要考虑blob数据转换成文件(图片). 可以拆 ...
表格进阶03——简历制作（用表格布局）
简历制作(用表格布局) 知识点: 1.水平方向上,横跨用colspan,4个格 <td colspan="4">会计</td> 2.竖直方向上,竖并用row ...
Day3—HTML个人简历制作及五彩导航练习
个人简历制作和五彩导航练习一.个人简历制作 1.表格 2.表单二.五彩导航 1.CSS超链接样式 1.1 CSS超链接样式设置 2.设置超链接状态样式 2.1 文本修饰 2.2 背景样式三.实例 ...
html个人简历制作
html个人简历制作合并步骤简历样式确定设计代码合并步骤确定跨什么找目标单元格,写上合并方式=合并单元格数量例如<td colspan="2"></ ...
前端学习之表格、简历制作及登录表单
简单表格制作 1.使用table标签 2.表格里的行用 tr 标签 3.单元格用 td 标签 <body><h3>前端技术阶段划分标准</h3> <tabl ...
html简单的简历制作
html简历制作第1版代码初体验 `<h1>简历<h1/><p>电话号码|邮箱<p/><hr/> <p>姓名<p/> ...
HR推荐：应届生简历制作的细节
HR推荐:简历制作的一些内容以及细节简历的主要内容包括哪些基本资料--小心谨慎的填写,不要写错了求职意向--绝对不能少教育背景--对于校招来说也不能少社会实践与工作经历(项目经验) 技能和特 ...

html（rowspan、colspan）练习-webstorm个人电子简历制作

html（rowspan、colspan）练习-webstorm个人电子简历制作相关推荐

最新文章

热门文章