阿七
级别: 未验证会员
精华:
0
发帖: 909
威望: 0 点
金钱: 2161 RMB
贡献值: 0 点
在线时间:512(小时)
注册时间:2006-03-29
最后登录:2008-08-07
|
表格，让Web看起来更美(5):绘制表格
单元格间距 a[P>SqT 4`
1|~#028
!/Bw,y ri<
通过表格自身确定它的布局是一件棘手的事。根据CSS2，每个表格的单元格都有填充属性 — 通过我们讨论过的箱体属性以及边框、它和其它单元格的间距定义。页边距并不适用于表格的单元格。 %YvSHh;c
i5E:FS^!I
g?A5'o&Yu
在 CSS 中，通过border-spacing属性控制单元格的间距： 属性： border-spacing $~G0#JL
^= izqh5S
可接受的取值： 一个或两个长度值 g"Q}
h
jWv3O&+?X
初始值： 0 ndKvJH4
C?/r}ly<\
适用于： 表格元素 ."F'5eTT~
_!C)r*0(
继承： 是 $ gr6
9o_ g_q
9&XV}I,~?|
VM<oUKh_3
border-spacing是一个长度值，表示单元格边框之间的水平和垂直间距；或是两个长度值，第一个数值表示水平间距，而第二个表示垂直间距。 e}?1T7NPG]
vh. Wm?qQ
N'eQ>2>O@
Internet Explorer和Navigator都忽略了这个属性。相反，它们能识别不赞成在TABLE元素中使用的CELLSPACING属性。这个属性接受一个数值，它是一个长度，以像素点为单位表示单元格间距。不能指定其它长度单位，而且必须在所有表格中显式地指定此属性。下面的例子里的TABLE开始标记指定表格的单元格间距为5个像素点。这个属性的默认值是3。 s.p1L
<i:*p1#Bm
yd0=h7s
单元格的填充用填充属性控制，但只适用于IE，Navigator不接受这些，它在TABLE元素中使用CELLPADDING属性，语法和CELLSPACING属性相同，默认值是0。 z,}c?BP
tyn?o
0uVk$\:i
表格的边框是一个比较复杂的情况。CSS2为表格规定了两种不同的边框模式，它们以略微不同的方式工作。Navigator完全忽略单元格的边框属性。Explorer则指出一种边框模式：分离边框模式。在这种模式中，每个单元格拥有通过它的边框属性指定的独立边框，边框的间距通过指定的border-spacing属性确定。在层叠边框模式中，可以为许多单元格和层次规定边框，但现在它还不被支持。既然这样，对它们的讨论在很大程度上就是哲学家式的讨论，这里就不再继续了。 QLF,/"
as\<nPT{Fj
"o^bN 9 =
'B:Z=0{>N
相反，这两个浏览器都识别TABLE元素中的BORDER属性，它也是接受一个指明表格边框宽度的值。对于单元格，边框画成三维凹入的；而对于表格，边框画成三维凸起的。 k\+y4F8$x
Q*09 E
下例示范了一个单元格间距为5、填充为5并且边框宽度为5的表格： o;M .Rt\A
-! 'Oy%a#
<TABLE BORDER=5 CELLPADDING=5 CELLSPACING=5> %jbJ6c
<TR><TH>Year</TH><TH>Bugs</TH><TH>Sales</TH></TR> _S9rF-9G]
<TR><TD>1995</TD><TD>2.3</TD><TD>500,000</TD></TR> .q5J^/kr
<TR><TD>1996</TD><TD>3.2</TD><TD>1,700,000</TD></TR> #Dj"W8'zh
<TR><TD>1997</TD><TD>5.6</TD><TD>8,200,000</TD></TR> ?
o
(ZTlT
<TR><TD>1998</TD><TD>12.3</TD><TD>33,000,000</TD></TR> * 1 |YLy
</TABLE> ts TR2+GZS
0%;N9\
F:[7^GQZ{
3o+ KP[A
Year Bugs Sales 6)=](VmNL`
1995 2.3 500,000 8N=%X-R%
1996 3.2 1,700,000 %+AS0 JhB
1997 5.6 8,200,000 I!|y;mh:it
1998 12.3 33,000,000
|
|
|
|
[楼 主]
|
Posted: 2006-04-04 09:52 |
| |
常州五颜六色网络技术有限公司 -> 网站建设 -> 表格，让Web看起来更美(5):绘制表格
