Html 如何修复使用colspan时填充Twitter引导单元格表

我正在尝试创建一个研究表，使用TwitterBootstrap3作为css框架。 我用

作为一个小时的电池，用

作为半小时的电池，所以我有17个电池（8小时加上一天1个电池）

#
9.000 - 10.00
10.00 - 11.00
11.00 - 12.00
12.00 - 13.00
13.00 - 14.00
14.00 - 15.00
15.00 - 16.00
16.00 - 17.00
周一
ITE-301，S1
A603，86
ITE-204，S1
D201，81
屠え
ITE-302，S1
A602，40
HUM-111，S1
B202，81
结婚
MSC-202，S1
A313，41
JPN-202，S1
D503，30

我希望它被呈现成这样。

第一个主题应该从上午9点到10点（上午9点30分）的中间开始，但我得到的是这个

它从10.00开始，就像设置为

colspan=“2”

之前的

td

一样，但剩余部分工作正常

我试图禁用每个css属性，发现如果我在

.table

上禁用

宽度：100%

，并将

填充：8px 0px

设置为

。table>tbody>tr>td

会正确渲染，但非常难看。

---

有什么解决办法可以得到我想要的表格吗？

如果你想让它起作用，你必须放弃

td

和

th

填充。这不是引导本身的问题，而是html

表的设计方式的问题。当它们被制作时，CSS还不存在。所有样式都是通过内联或属性完成的。在我们的例子中，借助于HTML5中不再支持的
cellpadding
table属性（Chrome已经放弃了对~v.20-ish的支持）

所以我想你需要

.table>tbody>tr>td, .table>tbody>tr>th, .table>tfoot>tr>td,
.table>tfoot>tr>th, .table>thead>tr>td, .table>thead>tr>th {
    padding: 0;
}

为了让它发挥作用。现在，如果要恢复填充，则需要将所有单元格内容包装在div中，并对其应用填充（即：
.table td>div、.table th>div{padding:8px；}
）
这是切实可行的解决方案

正确的解决方案是不使用
s进行布局。它们是为表格数据设计的

下面是一个肮脏的lil修复程序，它使用jQuery和CSS，动态地将div包装器添加到所有非空的
td
s和
th
s内容中。不需要使用
text align:center
规则，我只是添加了它，因为我觉得它看起来更好


$（'.table th，.table td'）。每个（函数（）{
$（this.html（$（this.html（）？$）（“”+$（this.html（）+“”）：“”）；
});
table.table>tbody>tr>td，table.table>tbody>tr>th，
table.table>tfoot>tr>td，table.table>tfoot>tr>th，
table.table>thead>tr>td，table.table>thead>tr>th{
填充：0；
边框：1px实心#ddd；
}
.表td>div.表th>div{
填充：8px；
文本对齐：居中；
}

#
9.000 - 10.00
10.00 - 11.00
11.00 - 12.00
12.00 - 13.00
13.00 - 14.00
14.00 - 15.00
15.00 - 16.00
16.00 - 17.00
周一
ITE-301，S1

A603，86
ITE-204，S1

D201，81
星期二
ITE-302，S1

A602，40
哼-111，S1

B202，81
结婚
MSC-202，S1

A313、41
JPN-202，S1

D503，30
非常感谢，我使用了您提供的脚本，将每列中的文本对齐设置为居中，使其完全对齐。
.table>tbody>tr>td, .table>tbody>tr>th, .table>tfoot>tr>td,
.table>tfoot>tr>th, .table>thead>tr>td, .table>thead>tr>th {
    padding: 0;
}