Giters

reactjs / ja.react.dev

React documentation website in Japanese

Home Page:https://ja.react.dev

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Font issue related to <em>

smikitky opened this issue · comments

commented

In some browser environments, Japanese text surrounded by <em></em> does not look different from ordinary texts. Technically speaking, this is not a bug but an intended behavior because Japanese fonts have no concept of italics. Still, we need to ensure the text is visually emphasized in some way or another, in all browsers.

Possible solutions:

  • Give up on <em> with Japanese (*あああ*) entirely, and use explicit brackets or quotation marks instead (「あああ」)
  • Add a rule in CSS and ensure <em> will somehow look different (But this also affects English text)
    • color
    • font-width
    • transform: skewX(-15deg);
  • Introduce "post-process" JavaScript code to change <em> to <strong> or <em class="bold"> only when it includes Japanese characters. Or find a way to do it during the server-side rendering process.