預計效果圖
代碼
話不多說,先上代碼
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>中國郵政儲蓄銀行</title>
</head>
<body>
<hr/>
<br/>
<br/>
<br/>
<h1 align="center" style="font-size:30pt">外幣小額存款利率</h1>
<hr/>
<h2 align="center" style="font-size:18pt">發佈日期:2013-02-18</h2>
<br/>
<br/>
<br/>
<table border="1" align="center" cellpadding="8" cellspacing="0">
<tr align="center" bgcolor="CC0000">
<th colspan="8" style="color:white">外幣小額存款利率表</th>
</tr>
<tr align="right" bgcolor="CC0000">
<th colspan="8" style="color:white">年利率:%</th>
</tr>
<tr align="center" bgcolor="#FAEBD7">
<th rowspan="2">執行日期</th>
<th rowspan="2">幣種</th>
<th rowspan="2">活期儲蓄</th>
<th colspan="5">定期儲蓄</th>
</tr>
<tr align="center" bgcolor="#FAEBD7">
<th width="60">一個月</th>
<th width="60">三個月</th>
<th width="60">六個月</th>
<th width="60">一年</th>
<th width="60">兩年</th>
</tr>
<tr align="center" bgcolor="#FAEBD7">
<td>2012.9.18</td>
<td>美元</td>
<td>0.05</td>
<td>0.2</td>
<td>0.35</td>
<td>0.55</td>
<td>0.85</td>
<td>0.85</td>
</tr>
<tr align="center" bgcolor="#FAEBD7">
<td>2013.2.18</td>
<td>歐元</td>
<td>0.005</td>
<td>0.03</td>
<td>0.1</td>
<td>0.25</td>
<td>0.3</td>
<td>0.3</td>
</tr>
<tr align="center" bgcolor="#FAEBD7">
<td>2012.7.1</td>
<td>英鎊</td>
<td>0.125</td>
<td>0.25</td>
<td>0.35</td>
<td>0.7</td>
<td>0.8</td>
<td>0.85</td>
</tr>
<tr align="center" bgcolor="#FAEBD7">
<td>2012.9.18</td>
<td>港幣</td>
<td>0.01</td>
<td>0.1</td>
<td>0.25</td>
<td>0.6</td>
<td>0.8</td>
<td>0.85</td>
</tr>
<tr align="center" bgcolor="#FAEBD7">
<td>2010.09.10</td>
<td>日元</td>
<td>0.0001</td>
<td>0.01</td>
<td>0.01</td>
<td>0.01</td>
<td>0.01</td>
<td>0.01</td>
</tr>
</table>
</body>
</html>
代碼可在我的GitHub中找到,鏈接在此
關鍵代碼解釋
<hr />
標籤在 HTML 頁面中創建一條水平線,如上所示
<br />
換行
<table>
<tr>
<td></td>
</tr>
</table>
其中table爲表單,tr表示一行,td表示爲一個單元格