生活随笔
收集整理的這篇文章主要介紹了
如何在html中制作个人简历表单
小編覺得挺不錯(cuò)的,現(xiàn)在分享給大家,幫大家做個(gè)參考.
這里我給大家介紹一下在html中如何去建一個(gè)表格
1.比如以下這個(gè)個(gè)人信息簡歷表格
2.在html中用代碼做一個(gè)表格,首先我們要給他簡歷一個(gè)整體框架,比如這個(gè)表格是幾行幾列,弄好框架之后再去弄里面的合并列或者合并行這些東西,這里的話,一個(gè)表格的結(jié)構(gòu)為以下代碼
<style>.tbb{border-collapse: collapse; width: 500px; height: 900px;margin: auto;}.tbb td{border: 1px solid #333;}.lj{height: 120px;}.lj ol{margin-left: px;margin-top: -50px;}
</style>
<body><table class="tbb"> :這里我們?nèi)ソo表格命名為tbb,方便一會(huì)我們在style里面去改樣式
<caption>個(gè)人簡歷
</caption> 這里是表格的名字
<thead> :這里是表頭的那一行
<tbody> :表身
<tr> 表格為14行6列,這里只需寫tr*14>td*6,然后按tab鍵,tr為行
<td colspan="4">基本信息:
</td> :這里第一行一列的元素獨(dú)占一行空間,所以在自身標(biāo)簽下合并列為4,然后把它以下3個(gè)td都去掉
</tr><tr><td width="100">姓名:
</td> :姓名的話這里我們在標(biāo)簽上直接設(shè)置個(gè)width為100就可以
<td colspan="2"></td> 這里意思是把第二行的第二列與第三列合并,所以我們把它下面的第三列去掉
<td rowspan="2" width="80"></td> :這里要插入照片,所以和自身下面那一列合并,在下一行中把要合并的那個(gè)列的塊去掉
</tr> 因?yàn)槔锩鏇]有內(nèi)容所以我們給它設(shè)置一個(gè)寬度為80、
<tr><td>畢業(yè)院校:
</td><td colspan="2"></td></tr><tr><td>性別:
</td><td width="80"></td><td>生日:
</td> 這塊我們直接給它隨便設(shè)置一個(gè)寬度
<td width="80"></td></tr><tr><td>學(xué)歷:
</td><td></td><td>專業(yè):
</td><td></td></tr><tr><td>外語水平:
</td><td></td><td colspan="2">聯(lián)系方式:
</td> 這里要和它下面的兩列合并,合并幾列就寫幾。然后把它下面要合并的
</tr> 幾列去掉就好
<tr> <td>籍貫:
</td><td colspan="2">家庭住址:
</td><td>婚姻:
</td></tr><tr><td colspan="4">職業(yè)技能:
</td></tr><tr><td colspan="4" class="lj"> <ol> 這塊我們直接給它設(shè)置一個(gè)有序列表,再來給它設(shè)置一個(gè)高度。
<li></li><li></li><li></li></ol></td></tr><tr><td colspan="4">項(xiàng)目經(jīng)驗(yàn):
</td></tr><tr><td colspan="2">智慧校園選課系統(tǒng)
</td> 這個(gè)塊要合并兩列,里面比較長所以這個(gè)塊顯得長一點(diǎn)
<td colspan="2">2019年1月~2019年6月
</td></tr><tr><td colspan="4" rowspan="2" height="30">項(xiàng)目描述:
</td> 這里它需要合并4列、2行,再設(shè)置一個(gè)
</tr> 寬度為30,在上面的css中給它設(shè)置為文字居中
<tr></tr><tr><td colspan="4">預(yù)覽地址:
</td></tr><tr><td>github:
</td><td colspan="3"></td></tr></tbody></thead></table>
這里還想說的是如果想把表單的表頭的內(nèi)容設(shè)置為黑色加粗字體,那么只需把表頭里面的td改為th即可。
以上是我為大家總結(jié)的表單,內(nèi)容有很多欠缺之處,還望大家指出毛病,謝謝大家。
總結(jié)
以上是生活随笔為你收集整理的如何在html中制作个人简历表单的全部內(nèi)容,希望文章能夠幫你解決所遇到的問題。
如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò),歡迎將生活随笔推薦給好友。