如何在html中制作个人简历表单

这里我给大家介绍一下在html中如何去建一个表格

1.比如以下这个个人信息简历表格
如何在html中制作个人简历表单_第1张图片
2.在html中用代码做一个表格,首先我们要给他简历一个整体框架,比如这个表格是几行几列,弄好框架之后再去弄里面的合并列或者合并行这些东西,这里的话,一个表格的结构为以下代码

<style>
	.tbb{width: %50;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">         :这里我们去给表格命名为tbb,方便一会我们在style里面去改样式
    		<caption>个人简历caption>    这里是表格的名字
    		<thead>     :这里是表头的那一行
    			<tbody>   :表身
    				<tr>    表格为14行6列,这里只需写tr*14>td*6,然后按tab键,tr为行
   <td colspan="4">基本信息:td> :这里第一行一列的元素独占一行空间,所以在自身标签下合并列为4,然后把它以下3个td都去掉
    				tr>
    				<tr>
    					<td width="100">姓名:td>  :姓名的话这里我们在标签上直接设置个width为100就可以
    					<td colspan="2">td>  这里意思是把第二行的第二列与第三列合并,所以我们把它下面的第三列去掉
    					
    	<td rowspan="2" width="80">td> :这里要插入照片,所以和自身下面那一列合并,在下一行中把要合并的那个列的块去掉
    				tr>                   因为里面没有内容所以我们给它设置一个宽度为80、
    				<tr>
    					<td>毕业院校:td>
    					<td colspan="2">td>
    				tr>
    				<tr>
    					<td>性别:td>
    					<td width="80">td>
    					<td>生日:td>   这块我们直接给它随便设置一个宽度
    					<td width="80">td>
    				tr>
    				<tr>
    					<td>学历:td>
    					<td>td>
    					<td>专业:td>
    					<td>td>
    				tr>
    				<tr>
    					<td>外语水平:td>
    					<td>td>
    					<td colspan="2">联系方式:td>  这里要和它下面的两列合并,合并几列就写几。然后把它下面要合并的
    				tr>                                几列去掉就好
    				<tr>  
    					<td>籍贯:td>
    					<td colspan="2">家庭住址:td>
    					<td>婚姻:td>
    
    				tr>
    				<tr>
    					<td colspan="4">职业技能:td>
    				tr>
    				<tr>
    					<td colspan="4" class="lj"> 
    					<ol>       这块我们直接给它设置一个有序列表,再来给它设置一个高度。
    						<li>li>
    						<li>li>
    						<li>li>
    					ol>
    					td>
    				tr>
    				<tr>
    					<td colspan="4">项目经验:td>
    				tr>
    				<tr>
    					<td colspan="2">智慧校园选课系统td>   这个块要合并两列,里面比较长所以这个块显得长一点
    					<td colspan="2">2019年1月~2019年6月td>
    				tr>
    				<tr>
    					<td colspan="4" rowspan="2" height="30">项目描述:td>  这里它需要合并4列、2行,再设置一个
    				tr>              宽度为30,在上面的css中给它设置为文字居中
    				<tr>
    				tr>
    				<tr>
    					<td colspan="4">预览地址:td>
    				tr>
    				<tr>
    					<td>github:td>
    					<td colspan="3">td>
    				tr>
    			tbody>
    		thead>
    	table>

这里还想说的是如果想把表单的表头的内容设置为黑色加粗字体,那么只需把表头里面的td改为th即可。
以上是我为大家总结的表单,内容有很多欠缺之处,还望大家指出毛病,谢谢大家。

你可能感兴趣的:(是的)