右から左への装飾文字の落とし穴

CONTENTS⤴︎ Manichaeism and Unicode Fleurons、そしてその他のプリンターの飾りは、タイポグラフィで使用される装飾的な要素です。これらの多くはデジタル時代にフォントに取り入れられており、Unicodeは❦や❧のような古典的なフリオンをサポートしています。 これらはブログのスタイリングにゆっくりと導入されつつありますが、適切に名付けられた❀（White Florette）からあまり知られていない᪥（Tai Tham Sign Dokmai）まで、視覚的なインジケーターに変わった追加のシンボルも含まれています。 私は最近、日付と投稿カテゴリの区切り文字として𐫱を使用することを検討していましたが、それが予期せずタグの中央にレンダリングされることに気づきました。 May 14 𐫱 400 Divisadero これはこのようにレンダリングされるべきです。 なぜそうならないのでしょうか？ May 14 𐫱 400 Divisadero Manichaeism and Unicode 𐫱はManichaean Punctuation Fleuronであり、マニ教の聖典を適応させるためのUnicodeのブロックの一部です。 マニ教が何であるかを知りたい場合は、それは3世紀のワールド・リジョンであり、積極的な迫害、キリスト教、イスラム教、仏教との競争、そしてそれに結びついていた帝国が崩壊したことによって衰退しました。 また、彼らは一部の急成長している宗教のように、死後の改宗者を許しませんでした。 気にしない場合は、彼らがかなりきれいな花のアイコンを持っていたこと、そして右から左に書くことを知っておくだけで十分です。 ほとんどのマニ教のスクリプトは右から左にのみ書かれますが、ウェブサイトではそれほど制約はありません。 Look at me Mom! עברית(HEBREW) and عربي(ARABIC) and 𐫖𐫀𐫗𐫏𐫐𐫏𐫀𐫗(MANICHAEAN) all in one sentence! Chromeがテキストのレイアウトに使用するレンダリングアルゴリズムは、左から右（LTR）と右から左（RTL）の両方の文字を含む双方向テキストを処理する必要があります。 Unicodeはよく記述されているため、それを説明するUnicode Bidirectional Algorithmがありますが、Unicodeは非常に複雑であるため、約2万語と51回の改訂が必要です。TL;DRに留めましょう。 各文字には双方向文字タイプがあります（UnicodeData.txtで確認できます）。これは、文字「A」のようなL（左）やヘブライ語テキストのR（右）のような強いタイプ、0のようなヨーロッパの数字のENのような弱いタイプ、またはタブやスペースのようなWSのようなニュートラルなタイプです。 興味がある場合は、ここにテーブルがあります。 強いタイプが優先され、弱いタイプは周囲の強いタイプに従います。 Manichaean fleuronはRタイプであり、数字400の弱いブロックを並べ替えます（内部順序は400のままですが、004ではありません）。これにより、𐫱 <span>400 Divisadero</span> が "𐫱 400 Divisadero" としてレンダリングされます。 Fixing with HTML and CSS 幸いなことに、これは私たちがそれを覚えていれば修正可能です！ フリオンを`<bdi>` HTMLタグでラップして、周囲のテキストから方向性を分離することができます。 𐫱 400 Divisadero CSSスタイル`unicode-bidi: bidi-override;`でも同様のことを行うことができます。 𐫱 400 Divisadero これはブラウザ全体でわずかに優れたサポートがあります。 IEを本当に気にする人は誰でしょうか。 <bdi> unicode-bidi 次に𞢹や𐩕のようなものに手を伸ばすときは、これを覚えておいてください。 これらはブログのスタイリングにゆっくりと導入されつつあります。 ↩︎ Dokmai means 'flower' in Tai Tham scripts like Northern Thai or Lao. ↩︎ Also they foolishly didn't allow post-deceased converts like some fast-growing religions. ↩︎ Look at me Mom! עברית(HEBREW) and عربي(ARABIC) and 𐫖𐫀𐫗𐫏𐫐𐫏𐫀𐫗(MANICHAEAN) all in one sentence! ↩︎ Here's the table if you're curious. ↩︎ 'Bidi' for bi-directional. ↩︎ Though who really cares about IE.