博客列表 >316表格学习与实战

316表格学习与实战

huang2018的博客
huang2018的博客原创
2018年03月26日 12:28:44629浏览

1、代码:

<table align="center" border="1px" cellspacing="0px" cellpadding="5px" width="50%">
		<caption><h2>示例表格<br/><a href=""><small>新增</small></a></h2></caption>
		<colgroup span="2" bgcolor="lightgreen">
			<col></col>
			<col bgcolor="lightgray"></col>
		</colgroup>
		<colgroup span="2" bgcolor="red"></colgroup>
		<thead>
			<tr bgcolor="skyblue">
				<th colspan="2">人员</th>
				<th colspan="2">材料</th>
				<th colspan="2" rowspan="2">操作</th>
			</tr>
			<tr bgcolor="skyblue">
				<th>编号</th>
				<th>姓名</th>
				<th>照片</th>
				<th>照片</th>
			</tr>
		</thead>
		<tbody>
			<tr align="center">
				<td>01</td>
				<td align="left"><img width="100px" src="../images/2.jpg"/>张三</td>
				<td>图1.1</td>
				<td>图1.2</td>
				<td><a href="">编辑</a></td>
				<td><a href="">删除</a></td>
			</tr>
			<tr align="center">
				<td>02</td>
				<td align="left"><img width="100px" src="../images/3.jpg"/>李四</td>
				<td>图2.1</td>
				<td>图2.2</td>
				<td><a href="">编辑</a></td>
				<td><a href="">删除</a></td>
			</tr>
		</tbody>
		<tfoot>
			<tr align="center" bgcolor="pink">
				<td colspan="2"><img width="100px" src="../images/5.jpg"> 选中王五</td>
				<td>正面</td>
				<td>侧面</td>
				<td>编辑</td>
				<td>删除</td>
			</tr>
		</tfoot>
	
	</table>
	<p align="center">
	<a href="">首页</a>
	<a href="">上一页</a>
	<a href="">下一页</a>
	<a href="">尾页</a>
	</p>

2、运行结果:

1522038388422601.jpg

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