在CSS中控制表单元格间距的行为

Nat*_*han 5 html css

有没有像table [cellspacing = x]这样的东西可以让我们用变量x来控制td边距?

我问这个是因为在我的设置中,我使用的是具有定义的重置样式表:

table {
   border-collapse:separate;
   border-spacing:2px;
   ...
}
Run Code Online (Sandbox Code Playgroud)

这工作正常,直到我们在html中遇到一行如此:

<table cellspacing=5>
Run Code Online (Sandbox Code Playgroud)

...

基本上,我希望能够在我的重置样式表中定义cellspacing的行为...

这可能与CSS有关吗?


更新:

嗯,实际上,让我更清楚我的问题:

我正在使用模板化系统,底部使用重置样式.

任何随机用户都可以在此基础上创建HTML内容,可能包含如下所示的表:

<table cellspacing=7>
Run Code Online (Sandbox Code Playgroud)

在处理table元素的cellspacing属性时,我想用自己的样式行为覆盖所有浏览器的默认样式行为.

传递给cellspacing属性的数字对我来说是未知的,因为系统是动态的.

我需要能够在重置样式表中使用CSS来控制cellspacing的行为来实现这一点,否则在我的重置样式表中,这行中将替换某些最终用户在其假设表中的cellspacing的类型:

table {
   border-collapse:separate;
   border-spacing:2px;
   ...
}
Run Code Online (Sandbox Code Playgroud)

因此,我需要一个语句,它将与最终用户传递给cellspacing属性的任何值一起使用.

我想这句话看起来像:

table[cellspacing=x] > td {
   ...
}
Run Code Online (Sandbox Code Playgroud)

这样我就可以在这个CSS定义的主体中使用变量x.

你看,我不能只使用像3或5或10这样的静态值进行cellspacing,因为当我制作我的重置样式表时,用户输入的值将不为我所知.他们可以放入他们想要的任何东西,但它总是使用相同的重置样式表.

这可能吗?

小智 0

您可以使用 CSS 中的 padding 属性来完成此操作。

table td {
    padding-bottom:10px;
    padding-right:25px;
}
Run Code Online (Sandbox Code Playgroud)

上面的代码将在每个单元格的右侧放置 25 像素的单元格间距,在每个单元格的底部放置 10 像素的单元格间距。我今天在自己的项目中确实做到了这一点:)