在 CSS 中设置 cellpadding 和 cellspacing?
技术问答
298 人阅读
|
0 人回复
|
2023-09-11
|
在 HTML 表格中,cellpaddingandcellspacing可以这样设置:) o1 a2 ^5 _( H/ E* s. s+ l
[table]6 Q3 x* |# ]5 b. h
如何使用 CSS 实现相同的功能?( ?$ b4 C2 l0 i7 P6 o4 H, V
& O: ?+ k" f: I' m7 E. o 解决方案:
1 [8 w/ s' |' p3 k% e 基本! h0 `4 R/ B3 Y9 i6 L, j. c" E5 F
为了控制 CSS 中的“cellpadding你可以简单地说padding使用表单元格。例如 10px 的“cellpadding”:
( [4 d" G2 C$ utd padding: 10px;}) O. p/ }0 T" j
对于“cellspacing,你可以border-spacingCSS 属性应用于您的表格。例如, 10px 的“cellspacing”:8 d) s: \' v: v% |+ \
table border-spacing: 10px; border-collapse: separate;}
* @! o1 }- y$ K3 p. C9 N 这一属性甚至允许单独的水平和垂直间距,这是旧的单元格间距无法实现的。
3 W1 A7 O+ D, M$ w& p3 ^ JIE 问题 ≤ 7
5 M8 |4 d$ t& l* D除 Internet Explorer 到 Internet Explorer 7,你几乎不走运。我说几乎是因为这些浏览器仍然支持它们。border-collapse将相邻表单元格边界的属性合并。假如您试图消除单元格间距(即 ),cellspacing="0"那么border-collapse:collapse它应该有同样的效果:表单元格之间没有空间。然而,这种支持是有问题的,因为它不会被覆盖cellspacingtable现有 元素HTML 属性。
! Z2 u: m l/ W0 e$ S2 _简而言之:非 Internet Explorer 5-7 浏览器,border-spacing处理您。对于 Internet Explorer,如果你的情况恰到好处(你想要 0 单元格距,你的表格还没有定义),你可以使用它border-collapse:collapse.
# |4 |; Q$ T, ~/ \4 M+ Xtable border-spacing: 0; border-collapse: collapse;}2 @. k* ?: M1 B7 Q
|
|
|
|
|
|