更新

Question

我们能做些什么，比如table [cellspacing = x]，它允许我们用变量x控制td边距？

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

table {
   border-collapse:separate;
   border-spacing:2px;
   ...
}

这样可以正常工作，直到我们在html中遇到一行：

<table cellspacing=5>

...

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

这可以用CSS吗？

更新

嗯，实际上，让我更清楚一下我的问题：

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

任何随机用户都可以在此基础上创建HTML内容，可能包含如下表格：

<table cellspacing=7>

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

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

我需要能够在重置样式表中使用CSS控制cellspacing的行为来完成此操作，否则在我的重置样式表中，此行中将覆盖任何某些最终用户键入其假设表格中的cellspacing：

table {
   border-collapse:separate;
   border-spacing:2px;
   ...
}

所以，我需要一个声明，它将与最终用户传递给cellspacing属性的任何值一起使用。

我想这句话看起来像是：

table[cellspacing=x] > td {
   ...
}

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

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

这可能吗？

Answer 1

你可以这样做：

table[cellspacing="5"] {
    border-spacing: 30px;
}

请参阅： http://jsfiddle.net/k2Qpt/

这使用attribute selector。

Answer 2

您可以使用填充属性从css中完成此操作。

table td {
    padding-bottom:10px;
    padding-right:25px;
}

以上将在每个细胞的右侧放置25px的细胞间距，在每个细胞的底部放置10px的细胞间距。我今天在我自己的项目中完成了这个：）

Answer 3

我不认为thirtydot理解这个问题......代码应该是：

table.spaced td {
    padding:5px;
}

如果您只希望类间隔的表具有cellspacing。

如果您希望每个表都有cellspacing：

table td {
    padding:5px;
}

这是一个jsFiddle：http://jsfiddle.net/ben7005/3w4EU/

Answer 4

关于您的更新：

我已经彻底考虑过这一点。如果你能做到的话，那会更好：

table[cellspacing] {
    border-spacing: auto;
}

将覆盖您的border-spacing: 2px。但是，这不起作用，因为您可以将auto或normal设置为border-spacing :(

如果您只需要支持现代浏览器，可以使用：

table:not([cellspacing]) {
    border-spacing: 20px;
}

请参阅： http://jsfiddle.net/7YUYs/

这只会选择没有设置table的{{1}}。

浏览器对cellspacing选择器的支持是合理的，只是在版本9之前它在IE中不起作用：

https://developer.mozilla.org/En/CSS/:not

要使其在旧版IE中运行，您可以使用：http://selectivizr.com/

如果这不是一个选项，我认为不需要使用JavaScript的唯一选择是这样做：

:not

请参阅： http://jsfiddle.net/UJasP/

所有table { border-spacing: 2px } table[cellspacing="0"] { border-spacing: 0 } table[cellspacing="1"] { border-spacing: 1px } table[cellspacing="2"] { border-spacing: 2px } table[cellspacing="3"] { border-spacing: 3px } ..都有table，但设置border-spacing: 2px的所有table都会将cellspacing设置为正确的值。您应该使用您认为需要的数字一样高 - CSS文件的大小不是问题。

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

更新

4 个答案: