Web实例_报表开发01-基于HTML进行报表呈现
报表开发是一种在利用了软件的基础上, 针对不同类型的报表, 进行开放的工作。
而以报表的方式, 将相关的内容、数值呈现出来的话, 则会起到更好的概况作用。
再加上, 报表开发工作是依托于计算机来完成的, 因此在效率、完整性等方面, 表现的也很不错。
报表开发的特点:
-
报表开发需要合理地进行分类, 至于分类的依据, 可以从样式这方面入手, 让不同样式的报表, 可以条理清晰地表现出工作内容。
-
报表越多的情况下, 数据库的内容也会随之丰富起来, 因此报表开发应当具备一定的相关结构, 这样才能让数据库显得更连贯。
报表开发的价值:
-
借助于报表开发, 可以对数据进行细致化处理, 而这个过程中运用到了计算机, 所以效率会比较高, 节省了人力上的成本。
-
有数据报表的情况下, 结合相关的数据内容, 可以在更好的程度上进行决策分析, 从而让企业获得更具价值魅力的前景。
报表开发已经在很多做管理体系的公司当中, 得到了充分的使用, 发挥了自身的特点以及价值。
报表开发流程
-
数据录入 (a. 数据填报, b. 数据清洗, c. 载入SQL数据库)
-
数据权限 (根据组织架构设计不同账号类型能够涉及到的数据权限)
-
数据呈现 (a. 按需提取SQL数据库的数据, b. 按需进行数据计算, c. 按需进行数据呈现)
-
外观设计
本例所处流程: 属于 3. 数据呈现 中的 c. 按需进行数据呈现 部分。
(因为第 3. 数据呈现 中的 c. 按需进行数据呈现 部分非常便于快速理解 报表开发 所要达到的目标, 所以放在前面做实例演示)
实例数据
现有一份XX集团2023年中秋国庆积分抵现明细表, 已经过数据脱敏处理。
CSV数据_XX集团2023年中秋国庆积分抵现明细表(已脱敏)-2024-03-31.zip
数据包含四川, 西安, 云南三个省2023年09月29日至2023年10月06日共8日积分抵现的明细记录。
数据如下:
实例需求
-
能够直观的呈现各省由近到远(日期)的每日积分抵现合计金额。
-
能够直观的呈现各省由近到远(日期)的每日积分抵现平均金额。
-
能够直观的呈现各省由近到远(日期)的每日积分抵现增长幅度。
-
能够对每日低于三省平均积分抵现金额的省份进行预警。
需求梳理 - 设计需求 & 沟通需求
需求(1): 能够直观的呈现各省由近到远(日期)的每日积分抵现合计金额。
使用 Microsoft Office Excel 2016 设计呈现效果。
使用数据透视表可以快速聚合数值, 排布行列:
需求(2): 能够直观的呈现各省由近到远(日期)的每日积分抵现平均金额。
使用 Microsoft Office Excel 2016 设计呈现效果。
使用数据透视表可以快速聚合数值, 排布行列:
需求(3): 能够直观的呈现各省由近到远(日期)的每日积分抵现增长幅度。
使用 Microsoft Office Excel 2016 设计呈现效果。
使用数据透视表可以快速聚合数值, 排布行列:
需求(4): 能够对每日低于三省平均积分抵现金额的省份进行预警。
使用 Microsoft Office Excel 2016 设计呈现效果 (将需要预警的省份名称标红)。
使用数据透视表可以快速聚合数值, 排布行列:
创建数据视图(View) - 为需求编写 SQL 语句
- 将报表所需的 “各省每日积分抵现合计金额”, “各省每日积分抵现平均金额”, “各省每日积分抵现增长幅度” 等尽量一次性计算为数据视图(View)。
效果如下:
↓
\downarrow
↓
附 MySQL 的 SQL 语句:
CREATE OR REPLACE VIEW report_xxgroup_2023_zq_gq_points_deduction AS
WITH Drive_Aggregate_by_Date AS (
SELECT
日期,
SUM(冲抵金额) AS 按日冲抵金额总计,
AVG(冲抵金额) AS 按日冲抵金额平均
FROM
view_xxgroup_2023_zq_gq_points_deduction
GROUP BY
日期
)
, Drive_Aggregate_by_Province AS (
SELECT
省,
SUM(冲抵金额) AS 按省冲抵金额总计,
AVG(冲抵金额) AS 按省冲抵金额平均
FROM
view_xxgroup_2023_zq_gq_points_deduction
GROUP BY
省
)
, Drive_Aggregate_by_Date_and_Province AS (
SELECT
日期,
省,
SUM(冲抵金额) AS 明细冲抵金额总计,
AVG(冲抵金额) AS 明细冲抵金额平均
FROM
view_xxgroup_2023_zq_gq_points_deduction
GROUP BY
日期,
省
)
, Drive_OLAP_by_Date AS (
SELECT
日期,
按日冲抵金额总计,
按日冲抵金额平均,
LEAD(按日冲抵金额总计, 1) OVER (ORDER BY 日期 DESC) AS 按日冲抵金额总计上日数据
FROM
Drive_Aggregate_by_Date
)
, Drive_OLAP_by_Date_and_Province AS (
SELECT
日期,
省,
明细冲抵金额总计,
明细冲抵金额平均,
LEAD(明细冲抵金额总计, 1) OVER (PARTITION BY 省 ORDER BY 日期 DESC) AS 明细冲抵金额总计上日数据
FROM
Drive_Aggregate_by_Date_and_Province
)
, Drive_Join_Table_Part_1 AS (
SELECT
T1.日期,
T1.省,
T1.明细冲抵金额总计,
T1.明细冲抵金额平均,
T2.按日冲抵金额平均,
IF(T1.明细冲抵金额总计上日数据 IS NOT NULL, ((T1.明细冲抵金额总计 - T1.明细冲抵金额总计上日数据) / T1.明细冲抵金额总计上日数据), 0.0) AS 明细增长幅度,
IF(T2.按日冲抵金额总计上日数据 IS NOT NULL, ((T2.按日冲抵金额总计 - T2.按日冲抵金额总计上日数据) / T2.按日冲抵金额总计上日数据), 0.0) AS 按日增长幅度
FROM
Drive_OLAP_by_Date_and_Province AS T1 LEFT JOIN Drive_OLAP_by_Date AS T2
ON
T1.日期 = T2.日期
)
SELECT
T1.日期,
DATE_FORMAT(T1.日期, "%m月%d日") AS 月日,
T1.省,
T1.明细冲抵金额总计,
T1.明细冲抵金额平均,
T1.明细增长幅度,
T1.按日增长幅度,
T1.按日冲抵金额平均,
T2.按省冲抵金额平均
FROM
Drive_Join_Table_Part_1 AS T1 LEFT JOIN Drive_Aggregate_by_Province AS T2
ON
T1.省 = T2.省;
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 16
- 17
- 18
- 19
- 20
- 21
- 22
- 23
- 24
- 25
- 26
- 27
- 28
- 29
- 30
- 31
- 32
- 33
- 34
- 35
- 36
- 37
- 38
- 39
- 40
- 41
- 42
- 43
- 44
- 45
- 46
- 47
- 48
- 49
- 50
- 51
- 52
- 53
- 54
- 55
- 56
- 57
- 58
- 59
- 60
- 61
- 62
- 63
- 64
- 65
- 66
- 67
- 68
- 69
- 70
- 71
- 72
- 73
- 74
- 75
- 76
- 77
- 78
- 79
- 80
- 81
- 82
- 83
- 84
- 85
- 86
- 87
- 88
纯 HTML 实现 - 理解 Web 表格的构建形式
HTML 表格标签 , , | , | 说明:
: Table / 定义了 HTML 表格 (HTML 表格由 元素和 1 个或多个 , | 和 | 元素组成。
| : Table Row / 表格中的一行。
| : Table Header Cell / 表格中的表头。
| : Table Data Cell / 表格中的一个单元格。
以 “需求(1): 能够直观的呈现各省由近到远(日期)的每日积分抵现合计金额” 为例, 构建 Web 表格。
效果如下:
↓
\downarrow
↓
附 HTML 代码:
DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
head>
<body style="background-color: #EFF3F5;">
<div class="table-container">
<table class="table-style" border="1" align="left" cellpadding="10" cellspacing="0">
<caption><b>XX集团各省由近到远(日期)的每日积分抵现合计金额b>caption>
<tr>
<th>省th>
<th>10月06日th>
<th>10月05日th>
<th>10月04日th>
<th>10月03日th>
<th>10月02日th>
<th>10月01日th>
<th>09月30日th>
<th>09月29日th>
<th>总计th>
tr>
<tr>
<td align="center">四川td>
<td align="center">111831td>
<td align="center">91333td>
<td align="center">84645td>
<td align="center">85928td>
<td align="center">119526td>
<td align="center">169005td>
<td align="center">143583td>
<td align="center">297034td>
<td align="center">1102885td>
tr>
<tr>
<td align="center">西安td>
<td align="center">273485td>
<td align="center">162851td>
<td align="center">119523td>
<td align="center">170458td>
<td align="center">174650td>
<td align="center">225007td>
<td align="center">247525td>
<td align="center">572872td>
<td align="center">1946371td>
tr>
<tr>
<td align="center">云南td>
<td align="center">229005td>
<td align="center">150066td>
<td align="center">139779td>
<td align="center">146863td>
<td align="center">174553td>
<td align="center">296661td>
<td align="center">217093td>
<td align="center">398506td>
<td align="center">1752526td>
tr>
<tr>
<td align="center"><b>总计b>td>
<td align="center"><b>614321b>td>
<td align="center"><b>404250b>td>
<td align="center"><b>343947b>td>
<td align="center"><b>403249b>td>
<td align="center"><b>468729b>td>
<td align="center"><b>690673b>td>
<td align="center"><b>608201b>td>
<td align="center"><b>1268412b>td>
<td align="center"><b>4801782b>td>
tr>
table>
div>
body>
html>
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 16
- 17
- 18
- 19
- 20
- 21
- 22
- 23
- 24
- 25
- 26
- 27
- 28
- 29
- 30
- 31
- 32
- 33
- 34
- 35
- 36
- 37
- 38
- 39
- 40
- 41
- 42
- 43
- 44
- 45
- 46
- 47
- 48
- 49
- 50
- 51
- 52
- 53
- 54
- 55
- 56
- 57
- 58
- 59
- 60
- 61
- 62
- 63
- 64
- 65
- 66
- 67
- 68
- 69
- 70
- 71
- 72
- 73
- 74
- 75
- 76
- 77
- 78
- 79
动态生成 HTML 标记语言 - 实时调取数据库数据 (以 PHP 脚本为例)
这里为了方便演示, 使用了简单的 PHP语言 实现, 使用 ASP语言, Java, JavaScript脚本语言, Python 的 Django Web框架 等, 都可实现同样效果。
以 “需求(2): 能够直观的呈现各省由近到远(日期)的每日积分抵现平均金额” 为例, 动态生成 HTML 标记语言, 构建 Web 表格。
需要注意的是, 在实现 需求(2) 的时候, 各省份最右边行尾的 各省总体平均值 不能简单的将该行的数据平均, 因为 先按日期分组平均再加总平均 与 直接按省份总体平均 的结果会有差异, 因为每组数据的数量不一样, 需要先在数据库计算好。
效果如下:
↓
\downarrow
↓
附 需求(2) 在 index.php 中 PHP 的函数调用代码:
<div class="table-container">
<table class="table-style" border="1" align="left" cellpadding="10" cellspacing="0">
<caption><b>XX集团各省由近到远(日期)的每日积分抵现平均金额</b></caption>
<?php
$pdo = Func_Init_MySQL_Connect_by_PDO($Arg_Host="127.0.0.1", $Arg_UserName="goufeng");
$sql__sc_avg = "SELECT DISTINCT 按省冲抵金额平均 FROM report_xxgroup_2023_zq_gq_points_deduction WHERE 省 = '四川'";
$sql__xa_avg = "SELECT DISTINCT 按省冲抵金额平均 FROM report_xxgroup_2023_zq_gq_points_deduction WHERE 省 = '西安'";
$sql__yn_avg = "SELECT DISTINCT 按省冲抵金额平均 FROM report_xxgroup_2023_zq_gq_points_deduction WHERE 省 = '云南'";
$sql_all_avg = "SELECT AVG(冲抵金额) FROM view_xxgroup_2023_zq_gq_points_deduction;";
$arr__sc_avg = Func_Exec_MySQL_Select_Stmt_Extract_Field_to_1D_Array_by_PDO($Arg_PDO=$pdo, $Arg_SQL_SELECT_Stmt=$sql__sc_avg );
$arr__xa_avg = Func_Exec_MySQL_Select_Stmt_Extract_Field_to_1D_Array_by_PDO($Arg_PDO=$pdo, $Arg_SQL_SELECT_Stmt=$sql__xa_avg );
$arr__yn_avg = Func_Exec_MySQL_Select_Stmt_Extract_Field_to_1D_Array_by_PDO($Arg_PDO=$pdo, $Arg_SQL_SELECT_Stmt=$sql__yn_avg );
$arr_all_avg = Func_Exec_MySQL_Select_Stmt_Extract_Field_to_1D_Array_by_PDO($Arg_PDO=$pdo, $Arg_SQL_SELECT_Stmt=$sql_all_avg );
$sql = "SELECT DISTINCT 月日 FROM report_xxgroup_2023_zq_gq_points_deduction";
$arr = Func_Exec_MySQL_Select_Stmt_Extract_Field_to_1D_Array_by_PDO($Arg_PDO=$pdo, $Arg_SQL_SELECT_Stmt=$sql);
Func_Read_1D_Array_to_HTML_Table_Header($Arg_1D_Array=$arr, $Arg_DIY_Head_of_Row="省", $Arg_DIY_Tail_of_Row="平均");
$sql = "SELECT 明细冲抵金额平均 FROM report_xxgroup_2023_zq_gq_points_deduction WHERE 省 = '四川'";
$arr = Func_Exec_MySQL_Select_Stmt_Extract_Field_to_1D_Array_by_PDO($Arg_PDO=$pdo, $Arg_SQL_SELECT_Stmt=$sql);
Func_Read_1D_Array_to_HTML_Table_Row($Arg_1D_Array=$arr, $Arg_DIY_Head_of_Row="四川", $Arg_DIY_Tail_of_Row=$arr__sc_avg[0]);
$sql = "SELECT 明细冲抵金额平均 FROM report_xxgroup_2023_zq_gq_points_deduction WHERE 省 = '西安'";
$arr = Func_Exec_MySQL_Select_Stmt_Extract_Field_to_1D_Array_by_PDO($Arg_PDO=$pdo, $Arg_SQL_SELECT_Stmt=$sql);
Func_Read_1D_Array_to_HTML_Table_Row($Arg_1D_Array=$arr, $Arg_DIY_Head_of_Row="西安", $Arg_DIY_Tail_of_Row=$arr__xa_avg[0]);
$sql = "SELECT 明细冲抵金额平均 FROM report_xxgroup_2023_zq_gq_points_deduction WHERE 省 = '云南'";
$arr = Func_Exec_MySQL_Select_Stmt_Extract_Field_to_1D_Array_by_PDO($Arg_PDO=$pdo, $Arg_SQL_SELECT_Stmt=$sql);
Func_Read_1D_Array_to_HTML_Table_Row($Arg_1D_Array=$arr, $Arg_DIY_Head_of_Row="云南", $Arg_DIY_Tail_of_Row=$arr__yn_avg[0]);
$sql = "SELECT 按日冲抵金额平均 FROM report_xxgroup_2023_zq_gq_points_deduction WHERE 省 = '四川'";
$arr = Func_Exec_MySQL_Select_Stmt_Extract_Field_to_1D_Array_by_PDO($Arg_PDO=$pdo, $Arg_SQL_SELECT_Stmt=$sql);
Func_Read_1D_Array_to_HTML_Table_Header($Arg_1D_Array=$arr, $Arg_DIY_Head_of_Row="平均", $Arg_DIY_Tail_of_Row=$arr_all_avg[0]);
?>
</table>
</div>
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 16
- 17
- 18
- 19
- 20
- 21
- 22
- 23
- 24
- 25
- 26
- 27
- 28
- 29
- 30
- 31
- 32
- 33
- 34
- 35
- 36
- 37
- 38
- 39
- 40
- 41
- 42
- 43
- 44
以 “需求(3): 能够直观的呈现各省由近到远(日期)的每日积分抵现增长幅度” 为例, 动态生成 HTML 标记语言, 构建 Web 表格。
效果如下:
↓
\downarrow
↓
附 需求(3) 在 index.php 中 PHP 的函数调用代码:
<div class="table-container">
<table class="table-style" border="1" align="left" cellpadding="10" cellspacing="0">
<caption><b>XX集团各省由近到远(日期)的每日积分抵现增长幅度</b></caption>
<?php
$sql = "SELECT DISTINCT 月日 FROM report_xxgroup_2023_zq_gq_points_deduction";
$arr = Func_Exec_MySQL_Select_Stmt_Extract_Field_to_1D_Array_by_PDO($Arg_PDO=$pdo, $Arg_SQL_SELECT_Stmt=$sql);
Func_Read_1D_Array_to_HTML_Table_Header($Arg_1D_Array=$arr, $Arg_DIY_Head_of_Row="省", $Arg_DIY_Tail_of_Row="合计增长");
$sql = "SELECT 明细增长幅度 FROM report_xxgroup_2023_zq_gq_points_deduction WHERE 省 = '四川'";
$arr = Func_Exec_MySQL_Select_Stmt_Extract_Field_to_1D_Array_by_PDO($Arg_PDO=$pdo, $Arg_SQL_SELECT_Stmt=$sql);
Func_Read_1D_Array_to_HTML_Table_Row($Arg_1D_Array=$arr, $Arg_DIY_Head_of_Row="四川", $Arg_DIY_Tail_of_Row="SUM");
$sql = "SELECT 明细增长幅度 FROM report_xxgroup_2023_zq_gq_points_deduction WHERE 省 = '西安'";
$arr = Func_Exec_MySQL_Select_Stmt_Extract_Field_to_1D_Array_by_PDO($Arg_PDO=$pdo, $Arg_SQL_SELECT_Stmt=$sql);
Func_Read_1D_Array_to_HTML_Table_Row($Arg_1D_Array=$arr, $Arg_DIY_Head_of_Row="西安", $Arg_DIY_Tail_of_Row="SUM");
$sql = "SELECT 明细增长幅度 FROM report_xxgroup_2023_zq_gq_points_deduction WHERE 省 = '云南'";
$arr = Func_Exec_MySQL_Select_Stmt_Extract_Field_to_1D_Array_by_PDO($Arg_PDO=$pdo, $Arg_SQL_SELECT_Stmt=$sql);
Func_Read_1D_Array_to_HTML_Table_Row($Arg_1D_Array=$arr, $Arg_DIY_Head_of_Row="云南", $Arg_DIY_Tail_of_Row="SUM");
$sql = "SELECT 按日增长幅度 FROM report_xxgroup_2023_zq_gq_points_deduction WHERE 省 = '四川'";
$arr = Func_Exec_MySQL_Select_Stmt_Extract_Field_to_1D_Array_by_PDO($Arg_PDO=$pdo, $Arg_SQL_SELECT_Stmt=$sql);
Func_Read_1D_Array_to_HTML_Table_Header($Arg_1D_Array=$arr, $Arg_DIY_Head_of_Row="总计", $Arg_DIY_Tail_of_Row="SUM");
?>
</table>
</div>
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 16
- 17
- 18
- 19
- 20
- 21
- 22
- 23
- 24
- 25
- 26
- 27
- 28
- 29
- 30
- 31
附 PHP 连接 MySQL 函数定义代码 (PDO 函数):
function Func_Init_MySQL_Connect_by_PDO($Arg_Host="127.0.0.1", $Arg_UserName="anonymous", $Arg_Password="12345678", $Arg_Database="gf_demo") {
$Inr_Host = $Arg_Host;
$Inr_UserName = $Arg_UserName;
$Inr_Password = $Arg_Password;
$Inr_Database = $Arg_Database;
try {
$dsn = "mysql:host=".$Inr_Host.";port=3306;charset=utf8;dbname=".$Inr_Database;
$pdo = new PDO($dsn, $Inr_UserName, $Inr_Password);
return $pdo;
} catch (PDOException $e) {
die ("Database Connection Error: ".$e->getMessage()."
");
}
}
function Func_Exec_MySQL_SELECT_Stmt_Extract_Field_to_1D_Array_by_PDO($Arg_PDO, $Arg_SQL_SELECT_Stmt) {
$Inr_PDO = $Arg_PDO;
$Inr_SQL_Statements = $Arg_SQL_SELECT_Stmt;
preg_match("/SELECT .* FROM/i", $Inr_SQL_Statements, $matches);
$Part_SELECT_of_SQL_Stmt = $matches[0];
$Part_SELECT_of_SQL_Stmt = str_ireplace(array("SELECT ", "SELECT DISTINCT ", " FROM"), "", $Part_SELECT_of_SQL_Stmt);
$Part_SELECT_of_SQL_Stmt = preg_split("/,/i", $Part_SELECT_of_SQL_Stmt);
if (count($Part_SELECT_of_SQL_Stmt) > 1) {
echo "[Caution] Function ( Func_Exec_MySQL_SELECT_Stmt_Extract_Field_to_1D_Array_by_PDO ) Running Error: SQL SELECT Statement Contains Multiple Fields.";
exit();
}
try {
$Rtn_Array = array();
$Result = $Inr_PDO->query($Inr_SQL_Statements);
$Data = $Result->fetchAll(PDO::FETCH_ASSOC);
foreach ($Data as $Num => $Line) {
foreach ($Line as $Field => $Value) {
array_push($Rtn_Array, $Value);
}
}
return $Rtn_Array;
} catch (PDOException $e) {
die ("[Caution] Database Query Error: ".$e->getMessage()."
");
}
}
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 16
- 17
- 18
- 19
- 20
- 21
- 22
- 23
- 24
- 25
- 26
- 27
- 28
- 29
- 30
- 31
- 32
- 33
- 34
- 35
- 36
- 37
- 38
- 39
- 40
- 41
- 42
- 43
- 44
- 45
- 46
- 47
- 48
- 49
- 50
- 51
- 52
- 53
- 54
- 55
- 56
- 57
- 58
- 59
- 60
- 61
- 62
- 63
- 64
- 65
- 66
- 67
- 68
- 69
- 70
- 71
- 72
- 73
- 74
- 75
- 76
- 77
- 78
- 79
- 80
- 81
- 82
- 83
- 84
- 85
- 86
- 87
- 88
- 89
- 90
- 91
- 92
- 93
- 94
- 95
- 96
- 97
- 98
- 99
- 100
- 101
- 102
- 103
- 104
- 105
附 PHP 输出 表格行(Table Row) 函数定义代码:
function Func_Numeric_in_1D_Array_Sum($Arg_1D_Array) {
$Inr_1D_Array = $Arg_1D_Array;
$Inr_1D_Array_Length = count($Inr_1D_Array);
if ($Inr_1D_Array_Length == 0) {
return NULL;
} else {
$Calc_Sum = 0;
for($i=0; $i < $Inr_1D_Array_Length; $i++)
if (is_numeric($Inr_1D_Array[$i]) == true)
$Calc_Sum += $Inr_1D_Array[$i];
return $Calc_Sum;
}
}
function Func_Numeric_in_1D_Array_Avg($Arg_1D_Array) {
$Inr_1D_Array = $Arg_1D_Array;
$Inr_1D_Array_Length = count($Inr_1D_Array);
if ($Inr_1D_Array_Length == 0) {
return NULL;
} else {
$Calc_Sum = 0;
$Calc_Count = 0;
for($i=0; $i < $Inr_1D_Array_Length; $i++) {
if (is_numeric($Inr_1D_Array[$i]) == true) {
$Calc_Sum += $Inr_1D_Array[$i];
$Calc_Count += 1;
}
}
$Calc_Avg = $Calc_Sum / $Calc_Count;
return $Calc_Avg;
}
}
function Func_Read_1D_Array_to_HTML_Table_Header($Arg_1D_Array, $Arg_DIY_Head_of_Row=NULL, $Arg_DIY_Tail_of_Row=NULL, $Arg_Decimal_Places=2) {
$Inr_1D_Array = $Arg_1D_Array;
if ($Arg_DIY_Head_of_Row != NULL) $Inr_1D_Array = array_merge(array($Arg_DIY_Head_of_Row), $Inr_1D_Array);
if (strtoupper($Arg_DIY_Tail_of_Row) == "SUM") {
array_push($Inr_1D_Array, Func_Numeric_in_1D_Array_Sum($Inr_1D_Array));
} else if (strtoupper($Arg_DIY_Tail_of_Row) == "AVG") {
array_push($Inr_1D_Array, Func_Numeric_in_1D_Array_Avg($Inr_1D_Array));
} else if ($Arg_DIY_Tail_of_Row != NULL) {
array_push($Inr_1D_Array, $Arg_DIY_Tail_of_Row);
}
$Inr_1D_Array_Length = count($Inr_1D_Array);
if ($Arg_Decimal_Places != NULL && is_numeric($Arg_Decimal_Places) == true)
for($i=0; $i < $Inr_1D_Array_Length; $i++) if (is_numeric($Inr_1D_Array[$i]) == true)
$Inr_1D_Array[$i] = sprintf("%.".$Arg_Decimal_Places."f", $Inr_1D_Array[$i]);
if ($Inr_1D_Array_Length < 1) {
echo "" ;
echo " ";
echo " ";
echo " | [Caution] Function ( Func_Read_1D_Array_to_HTML_Table_Row ) Value of 1D Array Error: No Data Available. | ";
echo " ";
echo " ";
echo "";
for($i=0; $i < $Inr_1D_Array_Length; $i++) {
echo "| ".$Inr_1D_Array[$i]." | ";
}
echo " ";
}
}
function Func_Read_1D_Array_to_HTML_Table_Row($Arg_1D_Array, $Arg_DIY_Head_of_Row=NULL, $Arg_DIY_Tail_of_Row=NULL, $Arg_Decimal_Places=2) {
$Inr_1D_Array = $Arg_1D_Array;
if ($Arg_DIY_Head_of_Row != NULL) $Inr_1D_Array = array_merge(array($Arg_DIY_Head_of_Row), $Inr_1D_Array);
if (strtoupper($Arg_DIY_Tail_of_Row) == "SUM") {
array_push($Inr_1D_Array, Func_Numeric_in_1D_Array_Sum($Inr_1D_Array));
} else if (strtoupper($Arg_DIY_Tail_of_Row) == "AVG") {
array_push($Inr_1D_Array, Func_Numeric_in_1D_Array_Avg($Inr_1D_Array));
} else if ($Arg_DIY_Tail_of_Row != NULL) {
array_push($Inr_1D_Array, $Arg_DIY_Tail_of_Row);
}
$Inr_1D_Array_Length = count($Inr_1D_Array);
if ($Arg_Decimal_Places != NULL && is_numeric($Arg_Decimal_Places) == true)
for($i=0; $i < $Inr_1D_Array_Length; $i++) if (is_numeric($Inr_1D_Array[$i]) == true)
$Inr_1D_Array[$i] = sprintf("%.".$Arg_Decimal_Places."f", $Inr_1D_Array[$i]);
if ($Inr_1D_Array_Length < 1) {
echo "" ;
echo " ";
echo " ";
echo " | [Caution] Function ( Func_Read_1D_Array_to_HTML_Table_Row ) Value of 1D Array Error: No Data Available. | ";
echo " ";
echo " ";
echo "";
for($i=0; $i < $Inr_1D_Array_Length; $i++) {
echo "| ".$Inr_1D_Array[$i]." | ";
}
echo " ";
}
}
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 16
- 17
- 18
- 19
- 20
- 21
- 22
- 23
- 24
- 25
- 26
- 27
- 28
- 29
- 30
- 31
- 32
- 33
- 34
- 35
- 36
- 37
- 38
- 39
- 40
- 41
- 42
- 43
- 44
- 45
- 46
- 47
- 48
- 49
- 50
- 51
- 52
- 53
- 54
- 55
- 56
- 57
- 58
- 59
- 60
- 61
- 62
- 63
- 64
- 65
- 66
- 67
- 68
- 69
- 70
- 71
- 72
- 73
- 74
- 75
- 76
- 77
- 78
- 79
- 80
- 81
- 82
- 83
- 84
- 85
- 86
- 87
- 88
- 89
- 90
- 91
- 92
- 93
- 94
- 95
- 96
- 97
- 98
- 99
- 100
- 101
- 102
- 103
- 104
- 105
- 106
- 107
- 108
- 109
- 110
- 111
- 112
- 113
- 114
- 115
- 116
- 117
- 118
- 119
- 120
- 121
- 122
- 123
- 124
- 125
- 126
- 127
- 128
- 129
- 130
- 131
- 132
- 133
- 134
- 135
- 136
- 137
- 138
- 139
- 140
- 141
- 142
- 143
- 144
- 145
- 146
- 147
- 148
- 149
- 150
- 151
- 152
- 153
- 154
- 155
- 156
- 157
- 158
- 159
- 160
- 161
- 162
- 163
- 164
- 165
- 166
- 167
- 168
- 169
- 170
- 171
- 172
- 173
- 174
- 175
- 176
使用 CSS 对 HTML 进行样式设计 - 调整字体颜色
层叠样式表 (英文全称: Cascading Style Sheets) 是一种用来表现 HTML (标准通用标记语言的一个应用) 或 XML(标准通用标记语言的一个子集) 等文件样式的计算机语言。
CSS 不仅可以静态地修饰网页, 还可以配合各种脚本语言动态地对网页各元素进行格式化。
以 “需求(4): 能够对每日低于三省平均积分抵现金额的省份进行预警” 为例, 利用 CSS 指定 HTML 标记样式, 更改字体颜色。
本例为了方便演示, 并且可以很直观看出, 四川 这个省份每个日期的数据都是明显低于三个省份的平均值的, 我们直接让 四川 这个省份的数据以 红色字体 显示, 以达到预警的效果。
步骤(1):
修改包含有 四川 数据的 表格行(Table Row) 的单元格中给 HTML 标签加上 类(Class) 属性。
(即在包含有 四川 数据的 标签中的所有 标签加上 class 属性)
在 标签中添加 class="alarm" 属性:
<tr>
<td class="alarm" align="center">四川td>
<td class="alarm" align="center">111831td>
<td class="alarm" align="center">91333td>
<td class="alarm" align="center">84645td>
<td class="alarm" align="center">85928td>
<td class="alarm" align="center">119526td>
<td class="alarm" align="center">169005td>
<td class="alarm" align="center">143583td>
<td class="alarm" align="center">297034td>
<td class="alarm" align="center">1102885td>
tr>
步骤(2):
在 HTML 文档的 | | | |