表格，让Web看起来更美(4):表头网站建设常州五颜六色网络技术有限公司

常州五颜六色网络技术有限公司 -> 网站建设 -> 表格，让Web看起来更美(4):表头

登录 -> 注册 -> 回复主题 -> 发表主题

阿七

2006-04-04 09:52

表格中的标题 uJ1oo| sn
j)Q}5M
=b)!l9TX
TD就是“Table Data”，这说明TD元素包含着表格中的数据。还有另外一种类型的单元格：TH元素，它表示表头。表头为特定单元格提供标题信息。前面例子中的表格可以用更好的方式描述： (?T{^Hg
+Swl$ab
<TABLE> P()&?C
<TR><TH>Year</TH><TH>Bugs</TH><TH>Sales</TH></TR> +WR'\15u
<TR><TD>1995</TD><TD>2.3</TD><TD>500,000</TD></TR> =(c.8d
<TR><TD>1996</TD><TD>3.2</TD><TD>1,700,000</TD></TR> }HbUB$5
<TR><TD>1997</TD><TD>5.6</TD><TD>8,200,000</TD></TR> VJr~h "[
<TR><TD>1999</TD><TD>12.3</TD><TD>33,000,000</TD></TR> md9JvbB
</TABLE> @YS,)U)4S
1csbuR?
(o\D=!a
b'/:e#F
Year Bugs Sales \`/ P*
1995 2.3 500,000 )iPU
1996 3.2 1,700,000 %f&Bt,xEo
1997 5.6 8,200,000 yRhD<*
1999 12.3 33,000,000 ?WS.RBe2
kMa|V 0
.lz=MUR
指定表头信息 (r<F@)J
!.q#X^@>L
有时表头覆盖哪些单元格并不明显。作者可以通过TH元素的SCOPE属性或TD元素的HEADERS属性来指定这种关系。SCOPE属性接受以下四种取值之一：row，默认值，表示此单元格包含它所在行的标题信息；column，表示覆盖它所在的列；rowgroup，表示覆盖它所在的行组；还有colgroup，表示覆盖它所在的列组。可以像下面那样充实我们的表格： 3)^2X
sv\=/F@n
<TABLE> O]25{ L
<TR> jfa<32`0E
<TH SCOPE="column">Year</TH> PDh!B_+
<TH SCOPE="column">Bugs</TH> bGj<Dojl
<TH SCOPE="column">Sales</TH> dr"@2=Z
</TR> %we! J%'Y]
<TR><TH SCOPE="row">1995</TH><TD>2.3</TD><TD>500,000</TD></TR> *unJd"<*&@
<TR><TH SCOPE="row">1996</TH><TD>3.2</TD><TD>1,700,000</TD></TR> #D+.z)iZn
<TR><TH SCOPE="row">1997</TH><TD>5.6</TD><TD>8,200,000</TD></TR> 2m& ?t_W
<TR><TH SCOPE="row">1999</TH><TD>12.3</TD><TD>33,000,000</TD></TR> ;Qlb].td
</TABLE> fAT M?
HEADERS属性接受以空格分隔的相应表头单元格ID属性值列表，可以像下面那样定义与上例相同的联系： 8vvNn>Q
Y$ZDJNz
<TABLE> c 8|&Q
<TR> Aacj?
<TH ID="year">Year</TH> v)!^%D
<TH ID="bugs">Bugs</TH> <+`} : A
<TH ID="salws">Sales</TH> l_&T)Ei
</TR> `9G1Bd8k
<TR> q0_Pl*
<TH ID="y1" HEADERS="year">1995</TH> !wjD6NK
<TD HEADERS="y1 bugs">2.3</TD> 3.04Toq!
<TD HEADERS="y1 sales">500,000</TD> {/qq*0wa
</TR> kQtnT7
<TR> $K~ t'wr
<TH ID="y2" HEADERS="year">1996</TH> 'n!Sco)C
<TD HEADERS="y2 bugs">3.2</TD> .iEzEmu
<TD HEADERS="y2 sales">1,700,000</TD> ]1KF3$n0
</TR> r1xhplHH@
<TR> {(`xA,El
<TH ID="y3" HEADERS="year">1997</TH> H?'t>JX
<TD HEADERS="y3 bugs">5.6</TD> G~\=:d=^,`
<TD HEADERS="y1 sales">8,200,000</TD> 'Y-Y By :
</TR> JVNp= ikK
<TR> ;kF+ V*
<TH ID="y4" HEADERS="year">1999</TH> O8w|!$Q.
<TD HEADERS="y4 bugs">12.3</TD> ns !Mqcm
<TD HEADERS="y4 sales">33,000,000</TD> ^y&sKO
</TR> #ZpR.$`k
</TABLE>