在HTML/CSS表格下方显示总数

Question

我创建了一些显示事务的表,最后一列是金额字段.我需要在此列下方显示总计/小计.问题是我的表列设置为%widths.

如何确保显示总金额的字段将低于金额列.

我想我需要一些CSS代码来保持总字段(div/span)与表宽度相关联,但我不知道如何做到这一点.

谢谢.

例:

Col1 Col2 Col3 Amount
A      B    C    100
D      E    F    100
          Total: 200

编辑:我也应该说这个表是动态的.它使用Visualforce(本机force.com语言)创建.然后将UI呈现为HTML,并且我确实有CSS来格式化生成的HTML表.由于我事先不知道我可以拥有多少行,因此我不能简单地为总计添加一行,并希望了解是否有更好的解决方案.

Answer 1

码

<!-- Style -->
<style>
   #total {
      text-align:right;
   }

   #table {
      border:1px solid red;
      border-collapse:separate;
   }

   #table th, #table td {
      border:1px solid #000;
   }
</style>

"总计"标签位于th跨越2列(检查肉桂评论).应用于此单元格的样式会移动右侧的所有文本.总数(200)与其他结果一致.

结果