博客列表 >20180322作业

20180322作业

朱佳楠的博客
朱佳楠的博客原创
2018年03月25日 18:26:47358浏览

实例

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>表格</title>
	<style>
		td img{
			width:40px;
			height: 40px;
			border-radius: 50%;
		}
		table,th,td{
			border:1px solid #333;
		}
		th,td{
			padding:10px;
		}
		table{
			border-collapse: collapse;
			margin: 50px auto;
			text-align: center;
			width: 60%;
			box-shadow: 10px 10px 5px #888888; 
		}
		caption{
			color:red;
			font-size: 1.6em;
			margin-bottom: 10px;
		}
	</style>
</head>
<body>
	<table>
		<caption>培训班学生登记表</caption>
		<tr>
			<th colspan="3">基本信息</th>
			<th colspan="2">其他信息</th>
		</tr>		
		<tr>
			<th>姓名</th>
			<th>头像</th>
			<th>年龄</th>
			<th>作业</th>
			<th>成绩</th>
		</tr>
		<tr>
			<td>张大大</td>
			<td><img src="../images/1.jpg" alt=""></td>
			<td>23</td>
			<td>完成</td>
			<td>优秀</td>
		</tr>
		<tr>
			<td>李啊啊</td>
			<td><img src="../images/3.jpg" alt=""></td>
			<td>22</td>
			<td>未完成</td>
			<td>不及格</td>
		</tr>
		<tr>
			<td>朱珊珊</td>
			<td><img src="../images/4.jpg" alt=""></td>
			<td>44</td>
			<td>完成</td>
			<td>及格</td>
		</tr>
	</table>
</body>
</html>

运行实例 »

点击 "运行实例" 按钮查看在线实例

手写代码:

5GPNP[P9UYG[`}LV%F`}CSP.png]5@W(ZOLY@$M)}ZLX3]]$RO.png

声明:本文内容转载自脚本之家,由网友自发贡献,版权归原作者所有,如您发现涉嫌抄袭侵权,请联系admin@php.cn 核实处理。
全部评论
文明上网理性发言,请遵守新闻评论服务协议