「利用者:Fet-Fe」の版間の差分
ナビゲーションに移動
検索に移動
細
→HTMLとCSSのノウハウ
>Fet-Fe 細 (→縦書き) |
>Fet-Fe 細 (→HTMLとCSSのノウハウ) |
||
| 141行目: | 141行目: | ||
=== 右横書き === | === 右横書き === | ||
日本語でかつて用いられていた右横書きはCSSで<code>direction: rtl; unicode-bidi: bidi-override;</code>で実現できる。 | 日本語でかつて用いられていた右横書きはCSSで<code>direction: rtl; unicode-bidi: bidi-override;</code><ref>https://developer.mozilla.org/ja/docs/Web/CSS/direction</ref>で実現できる。 | ||
: <span style="direction: rtl; unicode-bidi: bidi-override;">「唐澤貴洋殺す。」</span> | : <span style="direction: rtl; unicode-bidi: bidi-override;">「唐澤貴洋殺す。」</span> | ||
| 155行目: | 155行目: | ||
エジプト語で用いられるヒエログリフは、Unicode上では欧米の言語のスタイルに合わせてltrとなっているものの、古代エジプトの碑文にはrtlのものが圧倒的に多い<ref>http://www.lingua.tsukuba.ac.jp/ippan/JGL/2005/2005-Nagai.pdf</ref>。 | |||
これを再現する場合、CSSで<code>transform: rotateY(180deg); display: inline-block;</code>を指定すれば良い。 | これを再現する場合、CSSで<code>transform: rotateY(180deg); display: inline-block;</code>を指定すれば良い。 | ||
| 161行目: | 161行目: | ||
: <span lang="egy" style="transform: rotateY(180deg); display: inline-block;">𓂋𓏺𓈖𓆎𓅓𓏏𓊖</span> | : <span lang="egy" style="transform: rotateY(180deg); display: inline-block;">𓂋𓏺𓈖𓆎𓅓𓏏𓊖</span> | ||
<code>display: inline-block;</code>を指定しているのはspanタグがインライン要素であるからであり、ブロックレベル要素に適用するならこれは不要。 | <code>display: inline-block;</code><ref>https://developer.mozilla.org/ja/docs/Web/CSS/display</ref>を指定しているのはspanタグがインライン要素であるからであり、ブロックレベル要素に適用するならこれは不要。 | ||
次の例はブロックレベル要素であるpタグに<code>transform: rotateY(180deg);</code>のみ適用した例である。 | 次の例はブロックレベル要素であるpタグに<code>transform: rotateY(180deg);</code>のみ適用した例である。 | ||
右の方に寄っていてパッと見つけにくいので注意。 | 右の方に寄っていてパッと見つけにくいので注意。 | ||