table表格总结!

原创 2018-12-22 15:50:03 407
摘要:table是表格其中tr是行td是列th标题,td其中的属性有colspan是跨行,rwospan是跨列。bordor是边框属性,margin是外边框,padding是内边距。<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>

table是表格其中tr是行td是列th标题,td其中的属性有colspan是跨行,rwospan是跨列。bordor是边框属性,margin是外边框,padding是内边距。

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title>作业表格</title>
	<style>
		body{width: 100%;}
		*{margin: 0px;padding: 0px;}
		table{border-collapse: collapse; margin: auto;margin-top: 30px;}
		tr th{height: 50px;width: 50px;}
		tr td{border: 1px solid #ccc;width: 5em;height: 3em;}
		.nav{height:100%;width: 100%;}/*为什么宽度超出了?*/
		tr td span{ font-family: 黑体;font-size:20px;background: #ccc;color: red;}
	</style>	
</head>
<body>
	<table>	
		<tr>
			<th colspan="8" ><em style="font-size: 30px;color: blue;" >个人简历</em></th>
		</tr>
		<trs>
			<td><span>姓名</span></td>
			<td><input class="nav" ="nav" type="text" placeholder="如初" ></td>
			<td>性别</td>
			<td></td>
			<td>出生年月</td>
			<td></td>
			<td rowspan="4"></td> 
			<!-- 此处不可以既跨行又跨列吗? -->
			<td></td>
			
		</tr>
		<tr>
			<td>籍贯</td>
			<td></td>
			<td>民族</td>
			<td></td>
			<td>政治面貌</td>
			<td></td>
		<tr>
		    <td>学历</td>
		    <td></td>
		    <td>学制</td>
		    <td></td>
		    <td>专业</td>
		    <td></td>
		</tr>
		<tr>
			<td>婚姻状况</td>
		    <td></td>
		    <td>身高</td>
		    <td></td>
		    <td>身体状况</td>
		    <td></td>
		</tr>
		<tr>
			<td>毕业院校</td>
			<td colspan="3" ></td>
			<td>E-mall</td>
			<td colspan="3" ></td>
		</tr>
		<tr>
			<td>联系地址</td>
			<td colspan="3" ></td>
			<td>邮编</td>
			<td colspan="3" ></td>
		</tr>
		<tr>
			<td>联系电话</td>
			<td colspan="7" ></td>
		</tr>
		<tr>
			<td>求职意向</td>
			<td colspan="7" ></td>
		</tr>
		<tr>
			<td>求职意向</td>
			<td colspan="7" ></td>
		</tr>
		<tr>
			<td>知识结构</td>
			<td colspan="7" ></td>
		</tr>
		<tr>
			<td>计算机</td>
			<td colspan="7" ></td>
		</tr>
		<tr>
			<td>语言能力</td>
			<td colspan="7" ></td>
		</tr>
		<tr>
			<td>获奖情况</td>
			<td colspan="7" ></td>
		</tr>
		<tr>
			<td>工作经历</td>
			<td colspan="7" ></td>
		</tr>
		<tr>
			<td>兴趣特长</td>
			<td colspan="7" ></td>
		</tr>
		<tr>
			<td>自我评价</td>
			<td colspan="7" ></td>
		</tr>
	</table>
</body>
</html>

有个问题为什么不能既跨行又跨列?

希望可以多留点作业!

批改老师:天蓬老师批改时间:2018-12-22 18:30:26
老师总结:课堂作业, 是有一定针对性的,如果想做更多的练习, 可以参考一些教材

发布手记

热门词条