在 CSS 中设置 cellpadding 和 cellspacing?
技术问答
299 人阅读
|
0 人回复
|
2023-09-11
|
在 HTML 表格中,cellpaddingandcellspacing可以这样设置:* p# z! N' ~) [1 _! L
[table]
3 [; ]1 T5 U. H0 l ^ 如何使用 CSS 实现相同的功能?
+ `. J) m/ W& S4 v+ p- T/ K1 R 1 e7 o: ~& }. O+ ~
解决方案:
# g. @9 T, K. O% p6 I/ _! A 基本. c' W& K0 ~* [+ _ g
为了控制 CSS 中的“cellpadding你可以简单地说padding使用表单元格。例如 10px 的“cellpadding”:
. {) F" t" a, I% x4 ytd padding: 10px;}
) W# q# M; ?# T3 M3 G8 h 对于“cellspacing,你可以border-spacingCSS 属性应用于您的表格。例如, 10px 的“cellspacing”:
# B! n* q l G0 Z. ?; d9 L6 Ptable border-spacing: 10px; border-collapse: separate;}0 }" [, U# W! g4 X/ G! @! I# L! J
这一属性甚至允许单独的水平和垂直间距,这是旧的单元格间距无法实现的。" u& ?. S, @, u5 g: B
IE 问题 ≤ 7
8 f* E M; |0 a( t8 o除 Internet Explorer 到 Internet Explorer 7,你几乎不走运。我说几乎是因为这些浏览器仍然支持它们。border-collapse将相邻表单元格边界的属性合并。假如您试图消除单元格间距(即 ),cellspacing="0"那么border-collapse:collapse它应该有同样的效果:表单元格之间没有空间。然而,这种支持是有问题的,因为它不会被覆盖cellspacingtable现有 元素HTML 属性。" U) S$ f5 y: e1 E% e/ [ F
简而言之:非 Internet Explorer 5-7 浏览器,border-spacing处理您。对于 Internet Explorer,如果你的情况恰到好处(你想要 0 单元格距,你的表格还没有定义),你可以使用它border-collapse:collapse.: R& `# `$ O% G" |: _3 {
table border-spacing: 0; border-collapse: collapse;}
, {# V4 s, e ~$ e2 P/ l |
|
|
|
|
|