如何根据表中的col数应用不同的样式

Question

我有不同的表，但唯一的区别是它们可能有不同的cols。 我想定义一种样式，如果列数为2，那么第一个td的宽度为80％，第二个宽度为105.如果表有三列，它们的宽度应为45％，45％和10％等等。

我怎样才能在CSS中做到这一点？如果在CSS中无法做到这一点，我怎么能在JQuery中做到这一点？

Answer 1

据我所知，由于您需要计算百分比并检测列数，因此不能仅使用CSS。

我使用jQuery示例设置a fiddle，假设每行的列数相同（不使用colspan）。我是这样做的：

var cols       = $('table tr:first td').size(),
    width      = 90 / cols,
    last_width = 10;

$('table td').css('width', width + "%");
$('table tr > td:last-child').css('width', last_width + "%");
​

使用的变量是列数，最后一列大小和其他列大小（宽度的90％乘以列数）。然后我们将生成的宽度应用于所有单元格，将最后一列宽度应用于每行的最后一个单元格。