从右到左打印表格单元格

ant*_*puz 11 html css html-table right-to-left

我创建了一个表,希望第一个单元格从右边开始而不是从左边开始默认.我尝试在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>
Run Code Online (Sandbox Code Playgroud)

任何人都可以建议一种方法来改变这个表的浮动吗?

Juk*_*ela 14

正如评论中所建议的那样,您可以将方向性设置为从右到左(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; }
Run Code Online (Sandbox Code Playgroud)


eyl*_*lay 5

有一个更简单的方法。您可以添加dir="rtl"到表中。

<table dir="rtl">
     ...
</table>
Run Code Online (Sandbox Code Playgroud)

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

<table style="direction:rtl">
     ...
</table>
Run Code Online (Sandbox Code Playgroud)


小智 0

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

CSS:

.result_table{float:left; width:100%; border-collapse:collapse; padding:0;}
.result_table th{float:right; padding:0;}
Run Code Online (Sandbox Code Playgroud)

JS:

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

示例 - jsFiddle