从右到左打印表格单元格

Question

我制作了一个表格，并希望第一个单元格从右侧开始，而不是默认从左侧开始。 我尝试更改 CSS 中的 float 属性，但似乎没有帮助。 这是代码：

<table border="0" width="100%" cellspacing="0" align="center" class="result_table">
    <tr align="right">
    <th bgcolor="#cccccc" align="right">1</th>
    <th bgcolor="#cccccc" size="17">2</th>
    <th bgcolor="#cccccc">3</th>
    <th bgcolor="#cccccc">4</th>
    </tr>

</table>

<style>
    table.result_table {
        float:right;
    }
</style>

任何人都可以建议一种方法来改变这张桌子的浮动吗？

Answer 1

正如评论中所建议的，您可以将方向性设置为从右到左（RTL）。但是，除非您的表格内容采用从右到左的语言，否则您还应该将表格内容元素中的方向性设置为从左到右。否则，它们继承 RTL 方向性，这在许多情况下会引起意外，因为方向性还设置整体文本方向性。这不会影响西方语言的正常文本，但会影响例如像“4 (5)”这样的内容，在 RTL 方向性下会显示为“(5) 4”。

因此，您应该设置

table.result_table {
  direction: rtl; }
table.result_table caption, table.result_table th, table.result_table td {
  direction: ltr; }

Answer 2

有一种更简单的方法。您可以将

dir="rtl"

添加到表格中。

<table dir="rtl">
     ...
</table>

或者您可以使用 CSS 而不是使用 HTML 属性：

<table style="direction:rtl">
     ...
</table>

Answer 3

我不确定这是否可以仅使用 CSS 来实现。如果使用 jQuery 适合您，这里有一个起始想法，可能会让您获得所需的结果：

CSS：

.result_table{float:left; width:100%; border-collapse:collapse; padding:0;}
.result_table th{float:right; padding:0;}

JS：

var cols = $('.result_table th').length;
var colWidth = 100 / cols;
$('.result_table th').css({width:colWidth+'%'})

示例 - jsFiddle