报表复杂表头

最新推荐文章于 2023-03-28 15:55:54 发布
最新推荐文章于 2023-03-28 15:55:54 发布
阅读量201 收藏
点赞数
分类专栏： 工作集锦 前端(JQuery+JS+H5+CSS) 文章标签： htMl 表格
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_43216437/article/details/115012911
版权

报表复杂表头

例子1

在这里插入图片描述

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style type="text/css">
        table{
            border-collapse: collapse;
        }
    </style>
</head>
<body>
<table  id="tab" cellpadding="1" cellspacing="1" border="1" class="layui-table">
    <thead>
    <tr>
        <th colspan="31">微厅小业务办理情况</th>
    </tr>
    <tr>
        <th>分类</th>
        <th colspan="3">电视包</th>
        <th colspan="3">来电名片</th>
        <th colspan="3">通信助理</th>
        <th colspan="12">挂机名片</th>
        <th rowspan="3" colspan="3">合计</th>
    </tr>
    <tr>
        <th>销售品名称</th>
        <th colspan="3">央视3568收费包</th>
        <th colspan="3">来电名片（10元/月）</th>
        <th colspan="3">通信助理产品（5元/月）</th>
        <th colspan="3">旺铺助手-信息服务版（5元/月）</th>
        <th colspan="3">旺铺助手-信息服务版（25元/月）</th>
        <th colspan="3">旺铺助手-信息服务版（68元/月）</th>
        <th colspan="3">旺铺助手-信息服务版（128元/月）</th>
    </tr>
    <tr>
        <th>资费</th>
        <th colspan="3">3元/月</th>
        <th colspan="3">10元/月</th>
        <th colspan="3">5元/月</th>
        <th colspan="3">5元/月</th>
        <th colspan="3">25元/月</th>
        <th colspan="3">68元/月</th>
        <th colspan="3">128元/月</th>
    </tr>
    <tr>
        <th>地市</th>
        <th>办理人数</th>
        <th>有效订购</th>
        <th>办理金额</th>
        <th>办理人数</th>
        <th>有效订购</th>
        <th>办理金额</th>
        <th>办理人数</th>
        <th>有效订购</th>
        <th>办理金额</th>
        <th>办理人数</th>
        <th>有效订购</th>
        <th>办理金额</th>
        <th>办理人数</th>
        <th>有效订购</th>
        <th>办理金额</th>
        <th>办理人数</th>
        <th>有效订购</th>
        <th>办理金额</th>
        <th>办理人数</th>
        <th>有效订购</th>
        <th>办理金额</th>
        <th>办理人数</th>
        <th>有效订购</th>
        <th>办理金额</th>
    </tr>
    </thead>
</table>
</body>
</html>

例子2

在这里插入图片描述

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<style>
			table{
				border-collapse: collapse;
			}
		</style>
	</head>
	<body>
		<table  id="tab" cellpadding="1" cellspacing="1" border="1" class="layui-table">
			<thead>
			<tr>
				<th colspan="34">电渠域网厅和资金归集等系统对账平衡表</th>
			</tr>
			<tr>
				<th rowspan="4">日期</th>
				<th colspan="24">第三方支付</th>
				<th rowspan="2" colspan="9">资金归集平衡表</th>
			</tr>
			<tr>
				<th colspan="4">网厅</th>
				<th colspan="2">资金归集</th>
				<th colspan="2">统一支付</th>
				<th rowspan="2" colspan="2">支付汇总</th>
				<th rowspan="2" colspan="2">翼支付对账文件</th>
				<th rowspan="2" colspan="2">集团电渠对账文件</th>
				<th rowspan="2" colspan="2">万维对账文件</th>
				<th rowspan="2" colspan="2">支付宝对账文件</th>
				<th rowspan="2" colspan="2">微信对账文件</th>
				<th rowspan="2" colspan="2">对账汇总</th>
				<th rowspan="2" colspan="2">平衡结果</th>
			</tr>
			<tr>
				<th colspan="2">充值</th>
				<th colspan="2">办理</th>
				<th colspan="2">进账</th>
				<th colspan="2">二维码</th>
				<th rowspan="2">期初余额</th>
				<th rowspan="2">期末余额</th>
				<th colspan="2">资金归集进账</th>
				<th colspan="4">资金归集实收</th>
				<th></th>
			</tr>
			<tr>
				<th>笔数</th>
				<th>金额</th>
				<th>笔数</th>
				<th>金额</th>
				<th>笔数</th>
				<th>金额</th>
				<th>笔数</th>
				<th>金额</th>
				<th>笔数</th>
				<th>金额</th>
				<th>笔数</th>
				<th>金额</th>
				<th>笔数</th>
				<th>金额</th>
				<th>笔数</th>
				<th>金额</th>
				<th>笔数</th>
				<th>金额</th>
				<th>笔数</th>
				<th>金额</th>
				<th>笔数</th>
				<th>金额</th>
				<th>笔数</th>
				<th>金额</th>
				<th>可用余额手工调账</th>
				<th>进账合计</th>
				<th>CRM集中受理</th>
				<th>CRM直接受理</th>
				<th>BSN及门户现金收费</th>
				<th>实收合计</th>
				<th>平衡结果</th>
			</tr>
			</thead>
		</table>
	</body>
</html>

例子3

在这里插入图片描述

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style type="text/css">
        table{
            border-collapse: collapse;
        }
    </style>
</head>
<body>
<table  id="tab" cellpadding="1" cellspacing="1" border="1">
    <thead>
    <tr>
        <th colspan="16">2021年02月25日支付中心对账平衡表</th>
    </tr>
    <tr>
        <th rowspan="2">支付方式</th>
        <th colspan="2">二维码</th>
        <th colspan="2">扫码枪</th>
        <th colspan="4">网页支付</th>
        <th colspan="2">汇总</th>
        <th colspan="2">对账文件</th>
        <th colspan="3">差异</th>
    </tr>
    <tr>
        <th>笔数</th>
        <th>金额</th>
        <th>笔数</th>
        <th>金额</th>
        <th>笔数</th>
        <th>金额</th>
        <th>笔数</th>
        <th>金额</th>
        <th>笔数</th>
        <th>金额</th>
        <th>笔数</th>
        <th>金额</th>
        <th>备注</th>
    </tr>
    </thead>
</table>
</body>
</html>

例子4

在这里插入图片描述

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style type="text/css">
        table{
            border-collapse: collapse;
        }
    </style>
</head>
<body>
<table  id="tab" cellpadding="1" cellspacing="1" border="1" class="layui-table">
    <thead>
    <tr>
        <th colspan="8">2021年2月25日第三方支付对账表</th>
    </tr>
    <tr>
        <th colspan="3">实收</th>
        <th colspan="2">对账文件</th>
        <th colspan="3">差异</th>
    </tr>
    <tr>
        <th></th>
        <th>笔数</th>
        <th>金额</th>
        <th>笔数</th>
        <th>金额</th>
        <th>笔数</th>
        <th>金额</th>
        <th>差异原因</th>
    </tr>
    </thead>
    <tbody>
    <tr>
        <td>翼支付</td>
        <td>2609</td>
        <td>1174355.00</td>
        <td>2611</td>
        <td>1174594.00</td>
        <td>-2</td>
        <td>-239</td>
        <td></td>
    </tr>
    <tr>
        <td>万维</td>
        <td>5</td>
        <td>936.00</td>
        <td></td>
        <td></td>
        <td>5</td>
        <td>936</td>
        <td>为网厅支付订单</td>
    </tr>
    <tr>
        <td>汇总</td>
        <td>2314</td>
        <td>1175291.00</td>
        <td>2611</td>
        <td>1174594.00</td>
        <td>3</td>
        <td>697.00</td>
        <td></td>
    </tr>
    </tbody>
</table>
</body>
</html>
极乐码农
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
专栏目录
多表头导出Excel
08-28
导出Excel表格 /// 导出Excel /// 创建Excel并写入数据 /// List转化为DataTable /// 转换数据类型
html table实现复杂表头的示例代码
11-20
使用html做复杂的表格。复杂表格一般是用到td的两个属性：rowspan 、colspan属性值。 在html中<td> 标签定义 HTML 表格中的标准单元格。 　　(1)rowspan 属性规定单元格可横跨的行数; 　　(2)colspan 属性规定单元格可横跨的列数。 <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>多表头表格</title> </head> <body> <table id="tab" cellpadding="1"
phpspreadsheet 导出多个工作表
qq_32421489的博客
03-25 429
phpspreadsheet 导出多个工作表
表单组件 form fastadmin（生成表单元素）
aochijing0046的博客
03-06 1334
Form组件 定义文件位置： /extend/fast/Formphp 通用参数 $name 通常为我们组件的名称（name属性值），我们在后台接收时可以通过这个名称来获取到它所对应的值 $value 通常为我们数据库中的值（元素value值），在新增的时候通常为空，在修改的时候通常需要是数据库中对应字段的值 $options 组件的扩展属性，通常为一一键值匹配并最终渲染...
layui table 复杂表头设计及固定表头、单元格内容相同自动合并、合计去除小数点
曉儂
12-07 1309
layui table 复杂表头设计及固定表头、单元格内容相同自动合并、合计去除小数点
10、HTML表格（table 、th、tr、td、合并单元格）的简单认识
热门推荐
qq_43535992的博客
02-01 1万+
1、表格的定义 表格的定义是通过 table 标签来定义的，当然了，如果只是写一个 table 标签，是看不见任何内容的，一个表格是由行和列组成，而在HTML中，行的定义又是由 tr 标签来定义的，列是由 td 标签来定义的。 例如： <table > <tr> <td>1-1</td> <td>1-2</t...
fastadmin创建分类（多级分类）
m0_67311445的博客
03-28 1126
基本效果就是这样。
fastadmin 动态column 动态表头 根据搜索条件改变的表格列数动态column表格 动态表头
weixin_45143733的博客
02-21 2369
fastadmin 动态column 动态表头 根据搜索条件改变的表格列数动态column表格 动态表头
fastadmin table 头部 筛选
qq_40816144的博客
06-13 4097
想实现一个这样的筛选 找了好久才找到这个功能实现的原理 首先 index.html文件建立一个这样的 样式 生成一个列表 也可以自己手动写一个 列表 下面这个是 自动生成的 代码如下： <ul class="nav nav-tabs" data-field="status"> <li class="active"><a href="#t-al...
FastAdmin增加bootstrap-table-fixed-columns冻结表头，及完善排序、列宽、合并行等问题
穿拖鞋写程序
03-05 4224
使用FastAdmin快速创建应用管理系统有一段时间了，不得不说在一些中小型应用领域使用起来非常快捷、有效和实用，对于一些需要前期快速验证的项目也会是很好的选择。闲言少叙，以下总结最近一个表格前端效果的实战经验。 FastAdmin使用bootstrap-table作为前端表格的基础组件库，通常列表交互展示已经够用了，包括通用搜索、排序、分页、导出、合并相同行/列等等。最近需要对表头进行冻结，找...
fastadmin的二次开发教程【简单搭建、多表格问题，API开发】
黄啊码
04-24 1万+
fastadmin的二次开发教程【简单搭建、多表格问题，API开发】
基于PHPexecl类生成复杂的报表表头示例
10-21
主要介绍了基于PHPexecl类生成复杂的报表表头功能,结合实例形式分析了实例化PHPexecl类生成复杂报表表头的具体步骤与相关操作技巧,需要的朋友可以参考下
siverlight报表,实现datagrid复杂表头
09-06
所以只好用datagrid来实现，所以重点就是表头设计了。所以自己经过网上找资料看博客学习，用C#做了一个小demo。暂时不是动态实现的（还在编写中，完成后会上传宫大家学习），是静态模版。动态的可以自行扩展,再加上...
行政数据分析看板8.xlsx
04-26
Excel数据看板，Excel办公模板，Excel模板下载，Excel数据统计，数据展示
自动驾驶运动规划(Motion Planning).pdf
04-26
自动驾驶运动规划(Motion Planning)问题分析
跟我一起写makefile
最新发布
04-26
跟我一起写makefile的PDF，学习用。
AI 技术落地有望强化客户运 营.pdf
04-26
AI 技术落地有望强化客户运 营.pdf
公司年会主持词模板.docx
04-26
年会班会资料，节目策划，游戏策划，策划案，策划方案，活动方案，筹办，公司年会，开场白，主持人，策划主题，主持词，小游戏。
BW报表使用操作手册
07-28
根据引用\[2\]，BW报表使用操作手册可以提供以下信息：用户可以在完全WEB浏览器界面中制作各种形式的自定义报表，包括KPI报表、驾驶舱仪表盘、发票、查询报表、高级交互功能报表等复杂报表。用户可以设计多页面、多...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值