次の CSS を使用して、テキストを右から左に読み上げています。
.rtl { unicode-bidi:bidi-override;direction:rtl;width:300px;}
<span class="rtl">.tfel οt thgir mοrf daer si txet sihT</span>
これは、ソース コード内のすべてのテキストを反転して表示する実験サイトの一部ですが、ユーザーが読めるようになっています。
テキストの文しかない場合はうまく機能します。ただし、テキストの長さが要素のサイズ (この場合は 300px) よりも長くなると、文の順序は機能しなくなります。例えば:
ソース:
<div class="rtl"> .skaerb txet eht ,htgnel niatrec a tsaP .yllamron demrof era shpargarap eht rehtehw ees ot secnetnes lareves dedulcni ev'I dna ,tfel ot thgir morf daer si txet sihT</div>
出力:
(画像が載せられないのでこちらにあります: http://img4.hostingpics.net/pics/990715343.jpg )
ご覧のとおり、「This text is read from right to left」という最初の文が下に配置されています。これは、段落の順序が間違っていることを意味します。
通常、テキストを上から下に流し、右から左に読む必要がある別の方法はありますか?
ありがとうございました