1.代碼
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style type="text/css">
table
{
border-collapse: collapse;
text-align: center;
table-layout: fixed;
width: 700px;
}
table td, table th
{
border: 1px solid #cad9ea;
color: #666;
height: 30px;
}
table thead th
{
background-color: #CCE8EB;
width: 100px;
}
table tr:nth-child(odd)
{
background: #fff;
}
table tr:nth-child(even)
{
background: #F5FAFA;
}
</style>
</head>
<body>
<div style="width: 100%; height: 15px"></div>
<table border="1">
<tr><th colspan="9" style="text-align: left;">url: {url}</th></tr>
<tr><th colspan="9" style="text-align: left;">時間范圍: {time}</th></tr>
<tr><th colspan="9" style="text-align: left;">總次數: {all_num}</th></tr>
<tr>
<td rowspan="6">TotalTime</td>
<td>超時區間</td>
<td>超時次數</td>
<td rowspan="6">downtime</td>
<td>超時區間</td>
<td>超時次數</td>
<td rowspan="6">HttpCode</td>
<td>錯誤類型</td>
<td>錯誤次數</td>
</tr>
<tr>
<td>(3-5)</td>
<td>{T(3-5)}</td>
<td>(2-5)</td>
<td>{d(2-5)}</td>
<td>解析失敗</td>
<td>{解析失敗}</td>
</tr>
<tr>
<td>[5-10)</td>
<td>{T[5-10)}</td>
<td>[5-10)</td>
<td>{d[5-10)}</td>
<td></td>
<td></td>
</tr>
<tr>
<td>[10-20)</td>
<td>{T[10-20)}</td>
<td>[10-20)</td>
<td>{d[10-20)}</td>
<td></td>
<td></td>
</tr>
<tr>
<td>[20-60)</td>
<td>{T[20-60)}</td>
<td>[20-60)</td>
<td>{d[20-60)}</td>
<td></td>
<td></td>
</tr>
<tr>
<td>[60,+)</td>
<td>{T[60,+)}</td>
<td>[60,+)</td>
<td>{d[60,+)}</td>
<td></td>
<td></td>
</tr>
<tr>
<td colspan="2">合計</td>
<td>{T[num]}</td>
<td rowspan="2" colspan="2"></td>
<td>{d[num]}</td>
<td rowspan="2" colspan="2"></td>
<td>{H[num]}</td>
</tr>
<tr>
<td colspan="2">錯誤率</td>
<td>{T[rate]}</td>
<td>{d[rate]}</td>
<td>{H[rate]}</td>
</tr>
</table>
<div style="width: 100%; height: 15px"></div>
</body>
</html>
2.效果
備注：可用戶發送郵件內容