Voltar

CSS反転（LTR→RTL）

左から右（LTR）のCSSを、アラビア語・ヘブライ語・ペルシャ語サイト向けの右から左（RTL）のCSSに変換します。逆変換も可能です。

使い方

CSSをRTLに反転。

元のCSS

反転後のCSS

利用できる言語:

次のツールCSVをJSONに変換→

CSS反転（LTR→RTL）: 用途

CSSを貼り付けると、leftとrightを入れ替え、4値のmargin、padding、border-width、border-radiusを反転し、float、text-align、direction、カーソル、影、translateXを調整して、右から左に書く言語でもレイアウトが機能するようにします。/* norotate */の付いた宣言はそのまま残ります。

使い方

元のCSSを貼り付け。
反転後のCSSを確認。
コピーしてサイトのRTL版で使用。

使うタイミング

サイトをアラビア語やヘブライ語に翻訳。
CSSテーマやライブラリを対応させる。
LTRとRTLのレイアウトを比較。

よくある質問

何を変更しますか？

プロパティと値のleftとright（margin-left、padding-right、float、text-align、left/right）を入れ替え、margin、padding、border-width、border-radiusの4値指定を反転し、directionのltr/rtl、e-resize・w-resizeなどのカーソル、translateXの符号を入れ替えます。

特定の行を反転させないことはできますか？

はい。宣言の末尾に/* norotate */または/*rtl:ignore*/コメントを付けると、そのまま残ります。

論理プロパティの方が良いのでは？

新しいCSSならその通りです。margin-inline-start、padding-inline-end、inset-inline-startは文字の方向に自動で合わせます。このツールは古いCSSや他者のCSSを変換するのに役立ちます。

本当に無料？

はい、100%無料です。登録不要、サブスクなし、利用制限なし。すべてのツール：Tools123は無料です。