html表格制作个人简历模板
- 格式:doc
- 大小:772.51 KB
- 文档页数:13
个人简历 html 模板以下是一个简单的个人简历 HTML 模板,你可以根据自己的需要进行修改和扩展:```html<!DOCTYPE html><html><head><title>个人简历</title></head><body><header><h1>个人简历</h1></header><main><section><h2>个人信息</h2><p><strong>姓名:</strong>[你的姓名]<br><strong>联系方式:</strong> [你的联系方式]<br><strong>电子邮箱:</strong> [你的电子邮箱]</p></section><section><h2>个人简介</h2><p>[你的个人简介]</p></section><section><h2>教育背景</h2><p>[学位],[学校名称],[毕业年份]<br>[学位],[学校名称],[毕业年份]</p></section><section><h2>工作经历</h2><p>[公司名称],[职位],[入职年份 - 离职年份]<br> [公司名称],[职位],[入职年份 - 离职年份]</p></section><section><h2>技能</h2><p>[技能 1],[技能水平 1]<br>[技能 2],[技能水平 2]<br>[技能 3],[技能水平 3]</p></section><section><h2>奖项与荣誉</h2><p>[奖项 1],[获奖年份 1]<br>[奖项 2],[获奖年份 2]<br>[奖项 3],[获奖年份 3]</p></section></main><footer><p>感谢你的关注!</p></footer></body></html>```上述模板包括个人信息、个人简介、教育背景、工作经历、技能和奖项与荣誉等部分。
个⼈简历⽤HTML编写 1<!DOCTYPE html>2<html>3<head>4<meta charset="utf-8">5<title>个⼈简历</title>6<style>7 body,*{8 margin: 0;9 }10 body{11 background:pink;12 }13</style>14</head>15<table border="2" cellspacing="0px" style="margin:auto;" width="800px">16<h3 align="center">个⼈简历</h3>17<tr height="50" style="text-align: center;">18<td rowspan="2">姓名</td>19<td rowspan="2" width="100"></td>20<td width="100">性别</td>21<td width="100"></td>22<td>⽂化程度</td>23<td width="100"></td>24<td rowspan="3" width="120">照⽚</td>25</tr>26<tr height="50" style="text-align: center;">27<td>⾝⾼</td>28<td></td>29<td>政治⾯貌</td>30<td></td>31</tr>32<tr height="50" style="text-align: center;">33<td width="100">籍贯</td>34<td colspan="2"></td>35<td>出⽣年⽉</td>36<td colspan="2"></td>37</tr>38<tr height="50" style="text-align: center;">39<td>户⼝所在地</td>40<td colspan="2"></td>41<td>婚否</td>42<td width="100"></td>43<td>民族</td>44<td></td>45</tr>46<tr height="50" style="text-align: center;">47<td>⾝份证号码</td>48<td colspan="2"></td>49<td>现居住地址</td>50<td colspan="3"></td>51</tr>52<tr height="50" style="text-align: center;">53<td>毕业院校</td>54<td colspan="3"></td>55<td>毕业时间</td>56<td colspan="2"></td>57</tr>58<tr height="50" style="text-align: center;">59<td>学习专业</td>60<td colspan="3"></td>61<td>爱好特长</td>62<td colspan="2"></td>63</tr>64<tr height="50" style="text-align: center;">65<td rowspan="2">个⼈简介</td>66<td colspan="6" rowspan="2"></td>67<tr height="50" style="text-align: center;">68</tr>69<tr height="50" style="text-align: center;">70<td>就学时间</td>71<td colspan="2">学校</td>72<td>学年</td>73<td>学历</td>74<td>专业</td>75<td>担任职务</td>76</tr>77<tr height="50" style="text-align: center;">78<td></td>79<td colspan="2"></td>80<td></td>81<td></td>82<td></td>83<td></td>84</tr>85<tr height="50" style="text-align: center;"> 86<td></td>87<td colspan="2"></td>88<td></td>89<td></td>90<td></td>91<td></td>92</tr>93<tr height="50" style="text-align: center;"> 94<td>英语应⽤⽔平</td>95<td colspan="3"></td>96<td>职业期望</td>97<td colspan="2"></td>98</tr>99<tr height="50" style="text-align: center;"> 100<td>计算机应⽤⽔平</td>101<td colspan="3"></td>102<td>⽣活要求</td>103<td colspan="2"></td>104</tr>105<tr height="50" style="text-align: center;"> 106<td rowspan="4">⼯作经历</td>107<td>时间</td>108<td colspan="3">⼯作地点</td>109<td colspan="2">职务</td>110</tr>111<tr height="50" style="text-align: center;"> 112<td ></td>113<td colspan="3"></td>114<td colspan="2"></td>115</tr>116<tr height="50" style="text-align: center;"> 117<td ></td>118<td colspan="3"></td>119<td colspan="2"></td>120</tr>121<tr height="50" style="text-align: center;"> 122<td ></td>123<td colspan="3"></td>124<td colspan="2"></td>125</tr>126<tr height="50" style="text-align: center;"> 127<td>待遇要求</td>128<td colspan="6"></td>129</tr>130<tr height="50" style="text-align: center;"> 131<td rowspan="2">联系⽅式</td>132<td>固定电话</td>133<td></td>134<td>现在住址</td>135<td></td>136<td>邮编</td>137<td></td>138</tr>139<tr height="50" style="text-align: center;"> 140<td>紧急联系⼈</td>141<td></td>142<td>与本⼈关系</td>143<td></td>144<td>联系电话</td>145<td></td>146</tr>147<tr height="50" style="text-align: center;"> 148<td rowspan="2">⾃我评价</td>149<td colspan="6" rowspan="2"></td> 150<tr height="50" style="text-align: center;"> 151</tr>152</table>153</body>154</html>显⽰效果:。
<html><head><title>个人简历</title></head><body><table border="2" width="700", height="700"><caption><font size=6>个人简历</font></caption><tr><th rowspan=4 width="110">粘贴相片</th><th>姓名:</th><th colspan=3></th></tr><tr><th>年龄:</th><th colspan=3></th></tr><tr><th>性别:</th><th colspan=3><form><input type="radio" name="sex" value="male" /> Male<input type="radio" name="sex" value="female" /> Female</form></th></tr><tr><th colspan=4 height="40">学历</th></tr><tr><th rowspan=4>中学阶段</th><th height="40">起止时间</th><th colspan=3>学校名字</th></tr><tr><td height="40"></td><td colspan=3> </td></tr><tr><td height="40"></td><td colspan=3> </td></tr><tr><td height="40"></td></tr><tr><th rowspan=4>大学阶段</th><th height="40">起止时间</th><th colspan=2>学校名字</th><th>院系</th></tr><tr><td height="40"></td><td colspan=2></td><td></td></tr><tr><td height="40"></td><td colspan=2></td><td></td></tr><tr><td height="40"></td><td colspan=2></td><td></td></tr><tr><th colspan=5 height="40">职历</th> </tr><tr><th height="40">起止时间</th><th colspan=3>单位名称</th><th>职位</th></tr><tr><td height="40"></td><th colspan=3></th><th></th></tr><tr><td height="40"></td><th colspan=3></th><td></td></tr><tr><td></td><th colspan=3></th></tr></table> </body>。
html实现个⼈简历代码<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><title>个⼈简历</title><link rel="stylesheet" href="css/index.css"></head><body><div class="container"><!-- container叫做整体,⼀般⽤在最⼤的那个div--><h1>⼈物简历-zml</h1><div class="nav"><!-- nav是导航的缩写,这⾥⽤的是⽆序列表,然后把块级元素换成⾏内元素--><ul><li><a href="#info">基本信息</a><!-- a标签⼀般都是指定id属性的--></li><li><a href="#early">早年经历</a></li><li><a href="#career">演艺经历</a></li><li><a href="#honer">获奖记录</a></li><li><a href="#action">社会活动</a></li><li><a href="#contact">联系⽅式</a></li></ul></div><div class="center"><img src="images/吴彦祖.jpg" width="200px" height="280px"><video src="video/肖申克的救赎.mp4" height="280px" controls></video></div><div class="margin"><!-- 因为下⾯都要加边距,所以我在这⾥统⼀加了--><!-- 基本信息--><div id="info"><h2>基本信息</h2><!-- ⽂本段落的话,就⽤p标签--><p>我和我的祖国</p><!-- 缩进的话,我们就不⽤空格了,太⿇烦,直接统⼀加样式选中这个p标签.然后缩进--></div><!-- 早年经历--><div id="early"><h2>早年经历</h2></div><!-- 演艺经历--><div id="career"><h2>演艺经历</h2><table border="1" align="center" cellspacing="0"><!-- border是边框,cell...是合并边框--><tr><!-- th是表头的意思,它⾃带加粗和居中样式--><!-- 如果没有指定宽度,那么它是根据你的内容来指定宽度的--><th width="100px">时期</th><th width="500px">经历</th></tr><tr><td>asd</td><td>......................</td></tr></table></div><!-- 获奖记录--><div id="honer"><h2>获奖记录</h2></div><!-- 社会活动--><div id="action"><h2>社会活动</h2></div><!-- 联系信息,就是说每⼀部分都给⼀个div--><div id="contact"><h2>联系⽅式</h2><p>请你将想告诉我的话放送⾄我的邮箱:</p><form action="mailto://123@" method="get"><textarea></textarea><br/><!-- 这⾥的⽂本域不够宽,那么因为只有⼀个textarea,所以你可以直接写这个标签名选中它--><!-- 如果你的宽度设置成百分之多少的话,那么这个都是基于⽗元素的--><button type="submit">提交</button><!-- ⽂本域,就是有三根下划线的那个--></form></div><div><p class="top"><a href="#">回到顶部</a></p></div><!-- 版权信息;每⼀个不同的地⽅都给⼀个div,这样就会有条理⼀点--><div id="copyright"><p>©asd</p></div></div></div></body></html>.container{background: #f0f0f0;margin: 0 15%;}h1{background: cornflowerblue;color: white;height: 70px;line-height: 70px;text-indent: 70px;}.nav{text-align: center;}.nav li{display: inline-block;background: cornflowerblue;height: 30px;width: 100px;line-height: 30px;border: 1px solid cornflowerblue;border-radius: 0 10px;text-align: center;}.nav li a{color: white;text-decoration: none;}.nav li a:hover{font-weight: bold;}.center{text-align: center;}.center img{margin: 0 30px;}.margin{margin: 0 30px;}.margin p{text-indent: 30px;}textarea{width: 100%;height: 100px;}#copyright{background: cornflowerblue;height: 70px;line-height: 70px;color: white;text-align: center;text-indent: 30px;font-size: 16px;}.top{text-align: center;}.top a{color: cornflowerblue;text-decoration: none;}.top a:hover{font-weight: bold;}笔记:container 整体,⼀般⽤在最⼤的div那⾥margin: 0(这⾥代表上下没有边距) 15%(占它⽗元素15%的⼀个缩进效果); nav: 导航的缩写text-indent: ⽂本缩进text-align: 居中,什么都可以居中:hover: xx的伪列选择器font-weight: bold;加粗是字体权重margin就是边距的意思,上下左右都可以设置。