0

たとえば、下のテーブルがあり、他のテーブルと同じように回転させたいとします。これどうやってするの？とにかくjavascriptなしでありますか？

回転前

<table>
    <tr>
        <td>
            A
        </td>
        <td>
            B
        </td>
    </tr>
    <tr>
        <td>
            C
        </td>
        <td>
            D
        </td>
    </tr>
</table>

回転後

<table>
    <tr>
        <td>
            B
        </td>
        <td>
            A
        </td>
    </tr>
    <tr>
        <td>
            D
        </td>
        <td>
            C
        </td>
    </tr>
</table>

視覚的に

A B        B A
C D  --->  D C
4

1 に答える 1

5

あなたはCSS3トランスフォームでそれを行うことができます：

​table, td {
    -webkit-transform: scaleX(-1);
       -moz-transform: scaleX(-1);
        -ms-transform: scaleX(-1);
         -o-transform: scaleX(-1);
            transform: scaleX(-1);
}​

参照： http： //jsfiddle.net/thirtydot/gE5sV/

ブラウザのサポート：http ：//caniuse.com/transforms2d

上記のリンクからわかるように、CSS3変換はIE8以前では機能しません。を使用してそれを行うことができfilterますが、テキストが非常に見栄えが悪くなるため、お勧めしません。

filter: progid:DXImageTransform.Microsoft.Matrix(M11=-1,M12=0,M21=0,M22=1,SizingMethod='auto expand');
于 2012-07-25T11:13:20.607 に答える