備忘録的に。
事象
Android端末(tablet,スマホなど)でChromeを使ってWebページを開いた時に、
font-weight: 700
font-family: 'Noto Sans JP'
で指定されたテキストが太字になっていなかった。
PCのChromeから同じWebページを開くと該当のテキストはちゃんと太字になっていた。
原因
2023年6月現在に至るまで、googleはAndroidで日本語のfont-weightの値を1つしかサポートしていないため。
解説
このIssueにある内容まんまを書いてしまうのですが、
Androidでは、CJK(中国語、日本語、韓国語)フォントについては1つのfont-weight(400, Regular)しか無い模様。
英数字などはすべてのfont-weight(100~900)をサポートしているようです。
これにより、例えばbootstrapのfw-boldクラスなどを使ってテキストを太字にしようとすると、
elementにfont-weight: 700 !importantが付与されるようのですが
Androidだと700のweightはサポートしていないので、400のweightで表示されてしまうという罠。
で、このスレッドを見る限りこの問題は未だに解決していなさそう。
一部の端末では端末側でfont-weightの他のバリエーションをサポートしてくれているみたいです。
情報が間違っている場合は指摘お願いします。