第一部分:一行多列
一、1行2列居中均分
1、效果
表格內(nèi)容 | 表格內(nèi)容 |
2、代碼:
<DIV align=center>
<TABLE cellSpacing=1 cellPadding=0 width="100%" bgColor=#ff0000 border=0>
<TBODY>
<TR bgColor=#ffffff height=20>
<TD>
<DIV align=center>表格內(nèi)容1</DIV></TD>
<TD>
<DIV align=center>表格內(nèi)容2</DIV></TD>
</TR></TBODY></TABLE></DIV>
二、1行3列居中均分
1、效果
表格內(nèi)容1 | 表格內(nèi)容2 | 表格內(nèi)容3 |
2、代碼
<DIV align=center>
<TABLE cellSpacing=1 cellPadding=0 width="100%" bgColor=#ff0000 border=0>
<TBODY>
<TR bgColor=#ffffff height=20>
<TD>
<DIV align=center>表格內(nèi)容1</DIV></TD>
<TD>
<DIV align=center>表格內(nèi)容2</DIV></TD>
<TD>
<DIV align=center>表格內(nèi)容3</DIV></TD>
</TR></TBODY></TABLE></DIV>
三、1行4列居中均分
1、效果
表格內(nèi)容1 | 表格內(nèi)容2 | 表格內(nèi)容3 | 表格內(nèi)容4 |
2、代碼
<DIV align=center>
<TABLE cellSpacing=1 cellPadding=0 width="100%" bgColor=#ff0000 border=0>
<TBODY>
<TR bgColor=#ffffff height=20>
<TD>
<DIV align=center>表格內(nèi)容1</DIV></TD>
<TD>
<DIV align=center>表格內(nèi)容2</DIV></TD>
<TD>
<DIV align=center>表格內(nèi)容3</DIV></TD>
<TD>
<DIV align=center>表格內(nèi)容4</DIV></TD>
</TR></TBODY></TABLE></DIV>
四、小結(jié)
通過(guò)以上演示,我們以1行4列來(lái)簡(jiǎn)要說(shuō)明(其實(shí),我還有一些技術(shù)問(wèn)題沒(méi)有全面解決,就裝一次吧)。細(xì)心的朋友會(huì)發(fā)現(xiàn),這是一套固定的搭配,每增加一列,只要增加:
<TD>
<DIV align=center>表格內(nèi)容4</DIV></TD>
就可以了,可以根據(jù)需要無(wú)限的增加。這是最重要的,其他什么不知道都行,會(huì)用就可以了,就這么簡(jiǎn)單。不過(guò),其中的要點(diǎn)是數(shù)字和顏色可以變化,其他不許動(dòng)。
第二部分:多行2列
一、2行2列居中均分
1、效果
表格內(nèi)容11 | 表格內(nèi)容12 |
表格內(nèi)容21 | 表格內(nèi)容22 |
2、代碼
<DIV align=center>
<TABLE cellSpacing=1 cellPadding=0 width="100%" bgColor=#ff0000 border=0>
<TBODY>
<TR bgColor=#ffffff height=20>
<TD>
<DIV align=center>表格內(nèi)容11</DIV></TD>
<TD>
<DIV align=center>表格內(nèi)容12</DIV></TD>
<TR bgColor=#ffffff height=20>
<TD>
<DIV align=center>表格內(nèi)容21</DIV></TD>
<TD>
<DIV align=center>表格內(nèi)容22</DIV></TD>
</TR></TBODY></TABLE></DIV>
二、3行2列居中均分
1、效果
表格內(nèi)容11 | 表格內(nèi)容12 |
表格內(nèi)容21 | 表格內(nèi)容22 |
表格內(nèi)容31 | 表格內(nèi)容32 |
2、代碼
<DIV align=center>
<TABLE cellSpacing=1 cellPadding=0 width="100%" bgColor=#ff0000 border=0>
<TBODY>
<TR bgColor=#ffffff height=20>
<TD>
<DIV align=center>表格內(nèi)容11</DIV></TD>
<TD>
<DIV align=center>表格內(nèi)容12</DIV></TD>
<TR bgColor=#ffffff height=20>
<TD>
<DIV align=center>表格內(nèi)容21</DIV></TD>
<TD>
<DIV align=center>表格內(nèi)容22</DIV></TD>
<TR bgColor=#ffffff height=20>
<TD>
<DIV align=center>表格內(nèi)容31</DIV></TD>
<TD>
<DIV align=center>表格內(nèi)容32</DIV></TD>
</TR></TBODY></TABLE></DIV>
三、4行2列居中均分
1、效果
表格內(nèi)容11 | 表格內(nèi)容12 |
表格內(nèi)容21 | 表格內(nèi)容22 |
表格內(nèi)容31 | 表格內(nèi)容32 |
表格內(nèi)容41 | 表格內(nèi)容42 |
2、代碼
<DIV align=center>
<TABLE cellSpacing=1 cellPadding=0 width="100%" bgColor=#ff0000 border=0>
<TBODY>
<TR bgColor=#ffffff height=20>
<TD>
<DIV align=center>表格內(nèi)容11</DIV></TD>
<TD>
<DIV align=center>表格內(nèi)容12</DIV></TD>
<TR bgColor=#ffffff height=20>
<TD>
<DIV align=center>表格內(nèi)容21</DIV></TD>
<TD>
<DIV align=center>表格內(nèi)容22</DIV></TD>
<TR bgColor=#ffffff height=20>
<TD>
<DIV align=center>表格內(nèi)容31</DIV></TD>
<TD>
<DIV align=center>表格內(nèi)容32</DIV></TD>
<TR bgColor=#ffffff height=20>
<TD>
<DIV align=center>表格內(nèi)容41</DIV></TD>
<TD>
<DIV align=center>表格內(nèi)容42</DIV></TD>
</TR></TBODY></TABLE></DIV>
四、小結(jié)
通過(guò)第二部分演示,我們以4行2列來(lái)簡(jiǎn)要說(shuō)明。請(qǐng)?jiān)偌?xì)心觀察一下,會(huì)發(fā)現(xiàn)顏色的變化的意義,每一種顏色的代碼表示增加一行:也就是每增加一列,只要增加:
<TR bgColor=#ffffff height=20>
<TD>
<DIV align=center>表格內(nèi)容41</DIV></TD>
<TD>
<DIV align=center>表格內(nèi)容42</DIV></TD>
就可以了,其他不許動(dòng),可無(wú)限增加行。
第三部分:多行3列
一、2行3列居中均分
1、效果
表格內(nèi)容11 | 表格內(nèi)容12 | 表格內(nèi)容13 |
表格內(nèi)容21 | 表格內(nèi)容22 | 表格內(nèi)容23 |
2、代碼
<DIV align=center>
<TABLE cellSpacing=1 cellPadding=0 width="100%" bgColor=#ff0000 border=0>
<TBODY>
<TR bgColor=#ffffff height=20>
<TD>
<DIV align=center>表格內(nèi)容11</DIV></TD>
<TD>
<DIV align=center>表格內(nèi)容12</DIV></TD>
<TD>
<DIV align=center>表格內(nèi)容13</DIV></TD>
<TR bgColor=#ffffff height=20>
<TD>
<DIV align=center>表格內(nèi)容21</DIV></TD>
<TD>
<DIV align=center>表格內(nèi)容22</DIV></TD>
<TD>
<DIV align=center>表格內(nèi)容23</DIV></TD>
</TR></TBODY></TABLE></DIV>
二、3行3列居中均分
1、效果
表格內(nèi)容11 | 表格內(nèi)容12 | 表格內(nèi)容13 |
表格內(nèi)容21 | 表格內(nèi)容22 | 表格內(nèi)容23 |
表格內(nèi)容31 | 表格內(nèi)容32 | 表格內(nèi)容33 |
2、代碼
<DIV align=center>
<TABLE cellSpacing=1 cellPadding=0 width="100%" bgColor=#ff0000 border=0>
<TBODY>
<TR bgColor=#ffffff height=20>
<TD>
<DIV align=center>表格內(nèi)容11</DIV></TD>
<TD>
<DIV align=center>表格內(nèi)容12</DIV></TD>
<TD>
<DIV align=center>表格內(nèi)容13</DIV></TD>
<TR bgColor=#ffffff height=20>
<TD>
<DIV align=center>表格內(nèi)容21</DIV></TD>
<TD>
<DIV align=center>表格內(nèi)容22</DIV></TD>
<TD>
<DIV align=center>表格內(nèi)容23</DIV></TD>
<TR bgColor=#ffffff height=20>
<TD>
<DIV align=center>表格內(nèi)容31</DIV></TD>
<TD>
<DIV align=center>表格內(nèi)容32</DIV></TD>
<TD>
<DIV align=center>表格內(nèi)容33</DIV></TD>
</TR></TBODY></TABLE></DIV>
三、4行3列居中均分
1、效果
表格內(nèi)容11 | 表格內(nèi)容12 | 表格內(nèi)容13 |
表格內(nèi)容21 | 表格內(nèi)容22 | 表格內(nèi)容23 |
表格內(nèi)容31 | 表格內(nèi)容32 | 表格內(nèi)容33 |
表格內(nèi)容41 | 表格內(nèi)容42 | 表格內(nèi)容43 |
2、代碼
<DIV align=center>
<TABLE cellSpacing=1 cellPadding=0 width="100%" bgColor=#ff0000 border=0>
<TBODY>
<TR bgColor=#ffffff height=20>
<TD>
<DIV align=center>表格內(nèi)容11</DIV></TD>
<TD>
<DIV align=center>表格內(nèi)容12</DIV></TD>
<TD>
<DIV align=center>表格內(nèi)容13</DIV></TD>
<TR bgColor=#ffffff height=20>
<TD>
<DIV align=center>表格內(nèi)容21</DIV></TD>
<TD>
<DIV align=center>表格內(nèi)容22</DIV></TD>
<TD>
<DIV align=center>表格內(nèi)容23</DIV></TD>
<TR bgColor=#ffffff height=20>
<TD>
<DIV align=center>表格內(nèi)容31</DIV></TD>
<TD>
<DIV align=center>表格內(nèi)容32</DIV></TD>
<TD>
<DIV align=center>表格內(nèi)容33</DIV></TD>
<TR bgColor=#ffffff height=20>
<TD>
<DIV align=center>表格內(nèi)容41</DIV></TD>
<TD>
<DIV align=center>表格內(nèi)容42</DIV></TD>
<TD>
<DIV align=center>表格內(nèi)容43</DIV></TD>
</TR></TBODY></TABLE></DIV>
四、小結(jié)
通過(guò)第三部分演示,我們以4行3列來(lái)說(shuō)明。請(qǐng)?jiān)偌?xì)心觀察顏色的變化的意義,每一種顏色的代碼表示增加一行:也就是每增加一行,只要增加:
<TR bgColor=#ffffff height=20>
<TD>
<DIV align=center>表格內(nèi)容41</DIV></TD>
<TD>
<DIV align=center>表格內(nèi)容42</DIV></TD>
<TD>
<DIV align=center>表格內(nèi)容43</DIV></TD>
就可以了,其他不許動(dòng),可無(wú)限增加行。
第四部分:多行多列
一、4行4列
1、效果
表格內(nèi)容11 | 表格內(nèi)容12 | 表格內(nèi)容13 | 表格內(nèi)容14 |
表格內(nèi)容21 | 表格內(nèi)容22 | 表格內(nèi)容23 | 表格內(nèi)容24 |
表格內(nèi)容31 | 表格內(nèi)容32 | 表格內(nèi)容33 | 表格內(nèi)容34 |
表格內(nèi)容41 | 表格內(nèi)容42 | 表格內(nèi)容43 | 表格內(nèi)容44 |
2、代碼
<DIV align=center>
<TABLE cellSpacing=1 cellPadding=0 width="100%" bgColor=#ff0000 border=0>
<TBODY>
<TR bgColor=#ffffff height=20>
<TD>
<DIV align=center>表格內(nèi)容11</DIV></TD>
<TD>
<DIV align=center>表格內(nèi)容12</DIV></TD>
<TD>
<DIV align=center>表格內(nèi)容13</DIV></TD>
<TD>
<DIV align=center>表格內(nèi)容14</DIV></TD>
<TR bgColor=#ffffff height=20>
<TD>
<DIV align=center>表格內(nèi)容21</DIV></TD>
<TD>
<DIV align=center>表格內(nèi)容22</DIV></TD>
<TD>
<DIV align=center>表格內(nèi)容23</DIV></TD>
<TD>
<DIV align=center>表格內(nèi)容24</DIV></TD>
<TR bgColor=#ffffff height=20>
<TD>
<DIV align=center>表格內(nèi)容31</DIV></TD>
<TD>
<DIV align=center>表格內(nèi)容32</DIV></TD>
<TD>
<DIV align=center>表格內(nèi)容33</DIV></TD>
<TD>
<DIV align=center>表格內(nèi)容34</DIV></TD>
<TR bgColor=#ffffff height=20>
<TD>
<DIV align=center>表格內(nèi)容41</DIV></TD>
<TD>
<DIV align=center>表格內(nèi)容42</DIV></TD>
<TD>
<DIV align=center>表格內(nèi)容43</DIV></TD>
<TD>
<DIV align=center>表格內(nèi)容44</DIV></TD>
</TR></TBODY></TABLE></DIV>
二、5行5列
1、效果
表格內(nèi)容11 | 表格內(nèi)容12 | 表格內(nèi)容13 | 表格內(nèi)容14 | 表格內(nèi)容15 |
表格內(nèi)容21 | 表格內(nèi)容22 | 表格內(nèi)容23 | 表格內(nèi)容24 | 表格內(nèi)容25 |
表格內(nèi)容31 | 表格內(nèi)容32 | 表格內(nèi)容33 | 表格內(nèi)容34 | 表格內(nèi)容35 |
表格內(nèi)容41 | 表格內(nèi)容42 | 表格內(nèi)容43 | 表格內(nèi)容44 | 表格內(nèi)容45 |
表格內(nèi)容51 | 表格內(nèi)容52 | 表格內(nèi)容53 | 表格內(nèi)容54 | 表格內(nèi)容55 |
2、代碼
<DIV align=center>
<TABLE cellSpacing=1 cellPadding=0 width="100%" bgColor=#ff0000 border=0>
<TBODY>
<TR bgColor=#ffffff height=20>
<TD>
<DIV align=center>表格內(nèi)容11</DIV></TD>
<TD>
<DIV align=center>表格內(nèi)容12</DIV></TD>
<TD>
<DIV align=center>表格內(nèi)容13</DIV></TD>
<TD>
<DIV align=center>表格內(nèi)容14</DIV></TD>
<TD>
<DIV align=center>表格內(nèi)容15</DIV></TD>
<TR bgColor=#ffffff height=20>
<TD>
<DIV align=center>表格內(nèi)容21</DIV></TD>
<TD>
<DIV align=center>表格內(nèi)容22</DIV></TD>
<TD>
<DIV align=center>表格內(nèi)容23</DIV></TD>
<TD>
<DIV align=center>表格內(nèi)容24</DIV></TD>
<TD>
<DIV align=center>表格內(nèi)容25</DIV></TD>
<TR bgColor=#ffffff height=20>
<TD>
<DIV align=center>表格內(nèi)容31</DIV></TD>
<TD>
<DIV align=center>表格內(nèi)容32</DIV></TD>
<TD>
<DIV align=center>表格內(nèi)容33</DIV></TD>
<TD>
<DIV align=center>表格內(nèi)容34</DIV></TD>
<TD>
<DIV align=center>表格內(nèi)容35</DIV></TD>
<TR bgColor=#ffffff height=20>
<TD>
<DIV align=center>表格內(nèi)容41</DIV></TD>
<TD>
<DIV align=center>表格內(nèi)容42</DIV></TD>
<TD>
<DIV align=center>表格內(nèi)容43</DIV></TD>
<TD>
<DIV align=center>表格內(nèi)容44</DIV></TD>
<TD>
<DIV align=center>表格內(nèi)容45</DIV></TD>
<TR bgColor=#ffffff height=20>
<TD>
<DIV align=center>表格內(nèi)容51</DIV></TD>
<TD>
<DIV align=center>表格內(nèi)容52</DIV></TD>
<TD>
<DIV align=center>表格內(nèi)容53</DIV></TD>
<TD>
<DIV align=center>表格內(nèi)容54</DIV></TD>
<TD>
<DIV align=center>表格內(nèi)容55</DIV></TD>
</TR></TBODY></TABLE></DIV>
四、小結(jié)
通過(guò)第四部分演示,我們細(xì)心觀察顏色的變化來(lái)確定增加行與列的意義。如下這組粉色代碼表示1行5列的意思,其中:每出現(xiàn)一次<TR bgColor=#ffffff height=20>,就增加了一行的含義,
<TR bgColor=#ffffff height=20>
<TD>
<DIV align=center>表格內(nèi)容51</DIV></TD>
<TD>
<DIV align=center>表格內(nèi)容52</DIV></TD>
<TD>
<DIV align=center>表格內(nèi)容53</DIV></TD>
<TD>
<DIV align=center>表格內(nèi)容54</DIV></TD>
<TD>
<DIV align=center>表格內(nèi)容55</DIV></TD>
每出現(xiàn)一個(gè)如下代碼:
<TD>
<DIV align=center>表格內(nèi)容55</DIV></TD>
表示增加一列 。其他的就無(wú)所謂了。表格中的內(nèi)容可鏈接地址。
聯(lián)系客服