html – 如何使用CSS在表格列中居中右对齐的数字？

下图显示了我要完成的任务：

UPD.如你所见,我需要最长的数字在其单元格中心,所有其他数字对齐到最长的数字的右边框.

UPD 2.数字是动态的(最初未知).

解决方法

似乎没有任何直接的CSS方法.但是,您可以考虑@CMKanode在评论中提出的方法.您需要对列中的数字进行预处理并计算其中最大的数字(由于您使用的是千位分隔符,因此需要使用区域设置敏感的解析),然后将数字保留到相同数量的字符,使用U图形空间作为与数字宽度相同的空格.而且,当然这个列将被声明为中心.

因此,在该示例中,将“5”填充到      5(假设你使用正常的空间作为千位分隔符; U 2009 THIN SPACE可能会更好,但它有字体问题.

该方法意味着您需要使用数字具有相同宽度的字体(计算机中的大多数字体),并且包含U 2007.

例如,如果数千分隔符是逗号或一段时间,则需要使用U 2008 PUNCTUATION SPACE.

最后,我觉得这太复杂了.可能最好使列对齐,但使用适当的左和右填充,根据列标题的宽度和数字的预期宽度选择作为一个好的猜测.

原文地址：https://www.jb51.cc/html/230793.html