HTML再接再厲(十七)：製作月曆

首先公布上一個單元 表格變化運用 的習題解答

CE	/	*	-
7	8	9	+
4	5	6
1	2	3	=
0		.

這個像計算機的表格語法為：

<TABLE BORDER=5 CELLSPACING=1 CELLPADDING=5>
 
<TR>
<TD ALIGN=CENTER WIDTH=30>CE</TD>
<TD ALIGN=CENTER WIDTH=30>/</TD>
<TD ALIGN=CENTER WIDTH=30>*</TD>
<TD ALIGN=CENTER WIDTH=30>-</TD>
</TR>
 
<TR>
<TD ALIGN=CENTER>7</TD>
<TD ALIGN=CENTER>8</TD>
<TD ALIGN=CENTER>9</TD>
<TD ALIGN=CENTER ROWSPAN=2>+</TD>
</TR>
 
<TR>
<TD ALIGN=CENTER>4</TD>
<TD ALIGN=CENTER>5</TD>
<TD ALIGN=CENTER>6</TD>
 
</TR>
 
<TR>
<TD ALIGN=CENTER>1</TD>
<TD ALIGN=CENTER>2</TD>
<TD ALIGN=CENTER>3</TD>
<TD ALIGN=CENTER ROWSPAN=2>=</TD>
</TR>
 
<TR>
<TD ALIGN=CENTER COLSPAN=2>0</TD>
 
<TD ALIGN=CENTER>.</TD>
 
</TR>
 
</TABLE>

製作月曆

現在試試看你能不能作出下方表格：

2001年12月
二十一世紀的第一年將近尾聲
周日	周一	周二	周三	周四	周五	周六
						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

製作這樣一份月曆並不困難，用到的都是在 基本表格旗標 和 表格變化運用 所提到過的旗標，如果你還不太熟悉，就回去看看。

語法解析

<TABLE BORDER=3 CELLSPACING=3 CELLPADDING=3>
 
<TR ALIGN=CENTER><TD COLSPAN=7><B>2001年12月</B></TD></TR>
 
<TR ALIGN=CENTER><TD COLSPAN=7><I>二十一世紀的第一年將近尾聲</I></TD></TR>
 
<TR ALIGN=CENTER>
<TD><B>周日</B></TD>
<TD><B>周一</B></TD>
<TD><B>周二</B></TD>
<TD><B>周三</B></TD>
<TD><B>周四</B></TD>
<TD><B>周五</B></TD>
<TD><B>周六</B></TD>
</TR>
 
<TR ALIGN=CENTER>
<TD></TD>
<TD></TD>
<TD></TD>
<TD></TD>
<TD></TD>
<TD></TD>
<TD>1</TD>
</TR>
 
<TR ALIGN=CENTER>
<TD>2</TD>
<TD>3</TD>
<TD>4</TD>
<TD>5</TD>
<TD>6</TD>
<TD>7</TD>
<TD>8</TD>
</TR>
 
<TR ALIGN=CENTER>
<TD>9</TD>
<TD>10</TD>
<TD>11</TD>
<TD>12</TD>
<TD>13</TD>
<TD>14</TD>
<TD>15</TD>
</TR>
 
<TR ALIGN=CENTER>
<TD>16</TD>
<TD>17</TD>
<TD>18</TD>
<TD>19</TD>
<TD>20</TD>
<TD>21</TD>
<TD>22</TD>
</TR>
 
<TR ALIGN=CENTER>
<TD>23</TD>
<TD>24</TD>
<TD>25</TD>
<TD>26</TD>
<TD>27</TD>
<TD>28</TD>
<TD>29</TD>
</TR>
 
<TR ALIGN=CENTER>
<TD>30</TD>
<TD>31</TD>
<TD></TD>
<TD></TD>
<TD></TD>
<TD></TD>
<TD></TD>
</TR>
 
</TABLE>

• 運用 COLSPAN 旗標將第一列(第二列)的七個小格子合併即可。容易吧！
• 如果你想連結不同的日子至不同的網頁，只要加上 A HREF 旗標即可，例如：
  <TD><A HREF="http://alfredcave.blogspot.com/"> 22 </A></TD>
• 看到月曆中空白的日子嗎？並沒有一個空白的格子(凹陷的效果)，只要<TD>與</TD>中間不輸入資料即可。

本文配合HTML 4.0撰寫，新版HTML均可向前相容。