html简单跨行跨列表格制作

主要属性:

  • 跨行(rowspan=“3”)双引号内的数值表示跨几行数值为几;
  • 跨列(colspan=“3”)双引号内的数值表示跨几列数值为几;
  • 一个带标题 (caption) 的表格;
  • 使用 Cell padding 来创建单元格内容与其边框之间的空白;
  • 使用 Cell spacing 增加单元格之间的距离;

表格代码:

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>表格</title>
	<style>


	table{
		width: 50%;
	}
	</style>
</head>
<body>
<table border="1" cellpadding="10px" cellspacing="0">
<caption>建设项目基本情况一览表</caption>
<tr>
	<td>项目名称</td>
	<td colspan="3">xx药业中西药生产配送中心建设项目竣工环保验收监测表</td>
</tr>
<tr>
	<td>建设地点</td>
	<td colspan="3">昆明市经开区大冲片区工业园区2-5#地块</td>
</tr>
<tr>
	<td rowspan="3">建设单位</td>
	<td rowspan="3">xx药业(集团)股份有限公司</td>
	<td rowspan="3">联系方式</td>
	<td>联系人:王工</td>
</tr>
<tr>
	<td>电话:0871-68181924</td>
</tr>
<tr>
<td>邮箱:1104038816@qq.com</td>
</tr>
<tr>
	<td rowspan="3">竣工验收单位</td>
	<td rowspan="3">昆明市环境监测中心</td>
	<td rowspan="3">联系方式</td>
	<td >联系人:王工</td>
</tr>
<tr>
	<td>电话:0871-68241008</td>
</tr>
<tr>
<td>邮箱:273987850@qq.com</td>
</tr>
<tr>
	<td>建设地点</td>
	<td colspan="3">3条中药饮片生产线(普通中药饮片1条、 特殊(毒性)中药饮片1条、直接 口服中药饮片1条)、药品配送中心、行政办公楼、1条保健食品生产线(保健食品产品种类主要包括胶囊、软胶囊、片剂、 颗粒剂、代用茶和调味料几种)以及相关生活配套设施及环保设施。</td>
</tr>
</table>	
</body>
</html>

表格效果图: 表格图

转载于:https://my.oschina.net/u/2953372/blog/810305

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值