表格进阶.htm

HTML语言的基础教程

<TABLE border=1 frame=hsides>
  <CAPTION>
  <P></P>
  <THEAD>
  <P></P></CAPTION>
  <TR>
    <TH>Food</TH>
    <TH>Drink</TH>
    <TH>Sweet</TH>
    <TD></TR></THEAD>
  <TBODY></TD></TR>
  <TR>
    <TD>A</TD>
    <TD>B</TD>
    <TD>C</TD></TR>
  <TR>
    <TD>D</TD>
    <TD>E</TD>
    <TD>F</TD>
    <TD></TR></TBODY></TD></TR></TABLE>
<P><!------vsides-------></P>
<H3>只显示左、右边框 &lt;table frame=vsides&gt;</H3>
<TABLE border=1 frame=vsides>
  <CAPTION>
  <P></P>
  <THEAD>
  <P></P></CAPTION>
  <TR>
    <TH>Food</TH>
    <TH>Drink</TH>
    <TH>Sweet</TH>
    <TD></TR></THEAD>
  <TBODY></TD></TR>
  <TR>
    <TD>A</TD>
    <TD>B</TD>
    <TD>C</TD></TR>
  <TR>
    <TD>D</TD>
    <TD>E</TD>
    <TD>F</TD>
    <TD></TR></TBODY></TD></TR></TABLE>
<P><!------lhs-------></P>
<H3>只显示左边框 &lt;table frame=lhs&gt;</H3>
<TABLE border=1 frame=lhs>
  <CAPTION>
  <P></P>
  <THEAD>
  <P></P></CAPTION>
  <TR>
    <TH>Food</TH>
    <TH>Drink</TH>
    <TH>Sweet</TH>
    <TD></TR></THEAD>
  <TBODY></TD></TR>
  <TR>
    <TD>A</TD>
    <TD>B</TD>
    <TD>C</TD></TR>
  <TR>
    <TD>D</TD>
    <TD>E</TD>
    <TD>F</TD>
    <TD></TR></TBODY></TD></TR></TABLE>
<P><!------rhs-------></P>
<H3>只显示右边框 &lt;table frame=rhs&gt;</H3>
<TABLE border=1 frame=rhs>
  <CAPTION>
  <P></P>
  <THEAD>
  <P></P></CAPTION>
  <TR>
    <TH>Food</TH>
    <TH>Drink</TH>
    <TH>Sweet</TH>
    <TD></TR></THEAD>
  <TBODY></TD></TR>
  <TR>
    <TD>A</TD>
    <TD>B</TD>
    <TD>C</TD></TR>
  <TR>
    <TD>D</TD>
    <TD>E</TD>
    <TD>F</TD>
    <TD></TR></TBODY></TD></TR></TABLE>
<P><!------void-------></P>
<H3>不显示任何边框 &lt;table frame=void&gt;</H3>
<TABLE border=1 frame=void>
  <CAPTION>
  <P></P>
  <THEAD>
  <P></P></CAPTION>
  <TR>
    <TH>Food</TH>
    <TH>Drink</TH>
    <TH>Sweet</TH>
    <TD></TR></THEAD>
  <TBODY></TD></TR>
  <TR>
    <TD>A</TD>
    <TD>B</TD>
    <TD>C</TD></TR>
  <TR>
    <TD>D</TD>
    <TD>E</TD>
    <TD>F</TD>
    <TD></TR></TBODY></TD></TR></TABLE>
<P><!--################## Rule ########################--><A name=rule></A></P>
<H2><IMG height=20 alt=+ src="表格进阶.files/br20t.gif" width=20 
tppabs="http://webclass/html/br20t.gif"> 表格中分隔线(Rules)的显示 <IMG height=14 
src="表格进阶.files/ie.gif" width=80 tppabs="http://webclass/html/ie.gif"></H2>
<P><!------all-------></P>
<H3>显示所有分隔线 &lt;table rules=all&gt; </H3><PRE>&lt;table border rules=all&gt;
&lt;colgroup&gt;&lt;col align=center span=2&gt;
&lt;colgroup align=right&gt;
     &lt;thead&gt;
          &lt;tr&gt;&lt;th&gt;Food&lt;/th&gt;&lt;th&gt;Drink&lt;/th&gt;&lt;th&gt;Sweet&lt;/th&gt;
     &lt;/thead&gt;
     &lt;tbody&gt;
          &lt;tr&gt;&lt;td&gt;A&lt;/td&gt;&lt;td&gt;B&lt;/td&gt;&lt;td&gt;C&lt;/td&gt;
          &lt;tr&gt;&lt;td&gt;D&lt;/td&gt;&lt;td&gt;E&lt;/td&gt;&lt;td&gt;F&lt;/td&gt;
     &lt;/tbody&gt;
     &lt;tbody&gt;
          &lt;tr&gt;&lt;td rowspan=3 align=right&gt;Total $-00.0&lt;/td&gt;
     &lt;/tbody&gt;
&lt;/table&gt;
</PRE>
<TABLE rules=all border=1>
  <CAPTION>
  <P></P>
  <COLGROUP>
  <COL span=2 align=middle>
  <COLGROUP align=right>
  <THEAD>
  <P></P></CAPTION>
  <TR>
    <TH>Food</TH>
    <TH>Drink</TH>
    <TH>Sweet</TH>
    <TD></TR></THEAD>
  <TBODY></TD></TR>
  <TR>
    <TD>A</TD>
    <TD>B</TD>
    <TD>C</TD></TR>
  <TR>
    <TD>D</TD>
    <TD>E</TD>
    <TD>F</TD>
    <TD></TR></TBODY>
  <TBODY></TD></TR>
  <TR>
    <TD align=right colSpan=3>Total $-00.0</TD>
    <TD></TR></TBODY></TD></TR></TABLE>
<P><!------groups-------></P>
<H3>只显示组(Groups)与组之间的分隔线 &lt;table rules=groups&gt; </H3>
<TABLE rules=groups border=1>
  <CAPTION>
  <P></P>
  <COLGROUP>
  <COL span=2 align=middle>
  <COLGROUP align=right>
  <THEAD>
  <P></P></CAPTION>
  <TR>
    <TH>Food</TH>
    <TH>Drink</TH>
    <TH>Sweet</TH>
    <TD></TR></THEAD>
  <TBODY></TD></TR>
  <TR>
    <TD>A</TD>
    <TD>B</TD>
    <TD>C</TD></TR>
  <TR>
    <TD>D</TD>
    <TD>E</TD>
    <TD>F</TD>
    <TD></TR></TBODY>
  <TBODY></TD></TR>
  <TR>
    <TD align=right colSpan=3>Total $-00.0</TD>
    <TD></TR></TBODY></TD></TR></TABLE>
<P><!------rows-------></P>
<H3>只显示行与行之间的分隔线 &lt;table rules=rows&gt; </H3>
<TABLE rules=rows border=1>
  <CAPTION>
  <P></P>
  <COLGROUP>
  <COL span=2 align=middle>
  <COLGROUP align=right>
  <THEAD>
  <P></P></CAPTION>
  <TR>
    <TH>Food</TH>
    <TH>Drink</TH>
    <TH>Sweet</TH>
    <TD></TR></THEAD>
  <TBODY></TD></TR>
  <TR>
    <TD>A</TD>
    <TD>B</TD>
    <TD>C</TD></TR>
  <TR>
    <TD>D</TD>
    <TD>E</TD>
    <TD>F</TD>
    <TD></TR></TBODY>
  <TBODY></TD></TR>
  <TR>
    <TD align=right colSpan=3>Total $-00.0</TD>
    <TD></TR></TBODY></TD></TR></TABLE>
<P><!------cols-------></P>
<H3>只显示列与列之间的分隔线 &lt;table rules=cols&gt; </H3>
<TABLE rules=cols border=1>
  <CAPTION>
  <P></P>
  <COLGROUP>
  <COL span=2 align=middle>
  <COLGROUP align=right>
  <THEAD>
  <P></P></CAPTION>
  <TR>
    <TH>Food</TH>
    <TH>Drink</TH>
    <TH>Sweet</TH>
    <TD></TR></THEAD>
  <TBODY></TD></TR>
  <TR>
    <TD>A</TD>
    <TD>B</TD>
    <TD>C</TD></TR>
  <TR>
    <TD>D</TD>
    <TD>E</TD>
    <TD>F</TD>
    <TD></TR></TBODY>
  <TBODY></TD></TR>
  <TR>
    <TD align=right colSpan=3>Total $-00.0</TD>
    <TD></TR></TBODY></TD></TR></TABLE>
<P><!------none-------></P>
<H3>不显示任何分隔线 &lt;table rules=none&gt; </H3>
<TABLE rules=none border=1>
  <CAPTION>
  <P></P>
  <COLGROUP>
  <COL span=2 align=middle>
  <COLGROUP align=right>
  <THEAD>
  <P></P></CAPTION>
  <TR>
    <TH>Food</TH>
    <TH>Drink</TH>
    <TH>Sweet</TH>
    <TD></TR></THEAD>
  <TBODY></TD></TR>
  <TR>
    <TD>A</TD>
    <TD>B</TD>
    <TD>C</TD></TR>
  <TR>
    <TD>D</TD>
    <TD>E</TD>
    <TD>F</TD>
    <TD></TR></TBODY>
  <TBODY></TD></TR>
  <TR>
    <TD align=right colSpan=3>Total $-00.0</TD>
    <TD></TR></TBODY></TD></TR></TABLE><BR>
<HR>
<IMG height=58 alt="NCD HOME" hspace=3 src="表格进阶.files/angel-homeg.gif" width=69 
align=left vspace=10 border=0> <A 
href="http://www.zjou.edu.cn/te/html/html.htm">(返回) HTML 语言教程：目录</A> 
<BR></BODY></HTML>