根據自己以前使用的簡單簡歷表格，對其進行了web前端還原，也算對自己初步學習知識的一個小小的記錄。
下面是簡歷預覽效果，很簡潔的那種：
代碼中沒什么太困難的地方，主要記錄下自己遇到的幾個小問題吧：
1、最開始的簡歷是word版本，里面的表格線是可以很簡單的拖動的，其實原簡歷表格效果除了外邊框和第一列邊框基本是整齊的，其他的邊框線很雜亂，不好完全還原，要設置很多的不同寬度樣式。所以我在excel表格中簡單的還原了word表格，重新分配了下。最后對整個表格進行了重新規划，用table標簽樣式設置了整體的表格寬，然后使用table中的td標簽單獨設置了每個單元格的寬度占10%，最后照片占兩列寬。
2、使用了<b>標簽進行了加粗字體，對需要填寫的簡歷項目進行加粗顯示。
3、對於照片還有后面合並需要占多行或多列的數據使用了，<colspan>以及<rowspan>進行設置。
4、對於簡歷，編程能力等需要填寫的內容，在相應的td中使用多段文字。並對該行設置class后單獨設置樣式。使用text-indent設置首行縮進，line-height設置行高等。
5、最后一個難點是行間距，采用<p>標簽中的margin：5px設置。
以下是代碼：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>莫某某個人簡歷</title> <style> h1{text-align: center;} body{text-align: center;} table{border:2px solid;width:720px;border-collapse: collapse;margin:0 auto;} table td{text-align:center;width:10%;height:50px;border:1px solid;} .char{text-indent: 2em;text-align: left;line-height: 1.2em;} p{margin: 5px auto;} </style> </head> <body> <h1><b>某某莫個人簡歷</b></h1> <table> <tr> <td><b>姓名</b></td> <td>某某莫</td> <td><b>性別</b></td> <td>男</td> <td><b>民族</b></td> <td>漢族</td> <td><b>籍貫</b></td> <td>湖南長沙</td> <td colspan="2" rowspan="3"><img src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1544267836720&di=54a698c73d068dd941acb91bafa6dbc9&imgtype=0&src=http%3A%2F%2F5b0988e595225.cdn.sohucs.com%2Fq_70%2Cc_zoom%2Cw_640%2Fimages%2F20170821%2Fc0dc6fce5aa7428b90e602fb05bb70a0.jpeg" width="140" height="152"></td> </tr> <tr> <td><b>身份證號</b></td> <td colspan="3"></td> <td colspan="2"><b>參加工作時間</b></td> <td colspan="2"></td> </tr> <tr> <td><b>出生年月</b></td> <td colspan="3"></td> <td colspan="2"><b>資格證書</b></td> <td colspan="2"></td> </tr> <tr> <td><b>學歷</b></td> <td></td> <td><b>畢業學校</b></td> <td colspan="2"></td> <td><b>專業</b></td> <td colspan="2"></td> <td><b>學位</b></td> <td></td> </tr> <tr> <td><b>身體狀況</b></td> <td>良好</td> <td><b>優秀品質</b></td> <td colspan="3">不斷學習、工作負責</td> <td><b>現居住地</b></td> <td colspan="3">長沙市</td> </tr> <tr> <td><b>學習經歷</b></td> <td colspan="9" class="char"> <p align="left">1</p> <p align="left">2</p> </td> </tr> <tr > <td><b>工作簡歷</b></td> <td colspan="9" class="char"> <p><b>一、</b></p> <p>1</p> <p><b>二、</b></p> <p>2</p> </td> </tr> <tr> <td><b>編程能力</b></td> <td colspan="9" class="char"> <p>1.</p> <p>2.</p> <p>3.</p> <p>4.</p> </td> </tr> <tr> <td><b>個人評價</b></td> <td colspan="9" class="char"> <p>1.</p> <p>2.</p> </td> </tr> </table> </body> </html>