web-dev-qa-db-ja.com

「[x] y」がRTL方向に正しく表示されないのはなぜですか?

<div style="direction: rtl">
[x]y
</div>

HTMLテキスト[x]yx]y]として表示されます。

その結果の理由は何ですか?

PS:その結果はChrome 56.0.2924.87(64-bit))になります。

34
Sayakiss

仕様に従って正しくレンダリングされます。右から左へのレイアウトを要求しました。レンダリングは最初に[文字を受け取ります。これは方向的に中立であるため、RTL実行で右端にレンダリングされ、ミラーリングされます(そのため、]のように見えます)。次に、その左側にx]yがこの順序で表示されます。これは、ラテン文字xyが固有の左から右の方向性とニュートラル]を持っているためです。それらから方向性を取得します。
描画する結論は、必要なレンダリングと右から左への方向性を使用する理由によって異なります。

27

理由はわかりませんが、修正方法はわかります。addunicode-bidi: bidi-override;。それについて more を参照してください

<div style="direction: rtl; unicode-bidi: bidi-override;">
[x]y
</div>

説明

Unicode-bidiプロパティは、同じドキュメントで複数の言語をサポートするためにテキストをオーバーライドする必要があるかどうかを設定または返すために、directionプロパティと共に使用されます。

行動を説明するのに十分なほど明確ではありません。ただし、機能します。

編集

MDN記事 は、ここにいくつかの光をもたらします、bidi-overrideは実際にはブラウザの標準のスマート動作を無効にし、すべてが期待どおりに/正常に動作します。

32
smnbbrv

いくつかの調査の後、私は 情報を見つけました: 右から左へのテキスト方向

括弧と角括弧には固有の方向はありません。左括弧はLTRとRTLのテキストランの間にあるため、周囲のテキストの方向を「継承」できません。したがって、デフォルトで段落のRTLベース方向になり、ヘブライ語のシャロムの左側に配置されます。閉じ角括弧は、左から右への1回のテキストに埋め込まれていることに注意してください。したがって、周囲のテキストの方向を採用し、英語の単語shalomの右側に配置されます。

17
kevin b.
1
Juber Qureshi

閉じ角括弧が必要な場合は、開き角括弧「[」を使用してみてください。逆も同様です。 「[」にマップされた文字を含むフォントがあり、表示されませんでした。データベースの文字を "]"に変更するとうまくいきました。

0