Androidでfont-weight:boldを適用する方法

Androidでは日本語にfont-weight:boldが適用されません。

<p style="font-weight:normal">ノーマル normal</p>
<p style="font-weight:bold">ボールド bold</p>

このHTMLをAndroidで確認すると次のようになります。

Androidでfont-weight:bold

日本語だけ太字になっていないですね、デフォルトのフォントにbold体がないらしいんですが、デバイス毎にフォントも変わるのでfont-familyでは回避できず。

対策としてはfont-weightの代わりにtext-shadowを利用して太字にします。

<p style="text-shadow:1px 0 0 black">ボールド bold</p>

ただ、この方法だとiPhoneでは太字になるけどAndroidでは太字になりません。Androidではtext-shadowのぼかし距離に0を指定すると指定が無視されます。そのため次のように指定しなくてはいけません。

<p style="text-shadow:1px 0 1px black">ボールド bold</p>

Androidでfont-weight:bold

じゃっかん滲みが気になりますね。ですのでAndroidを考慮したスマートフォンサイトのデザインでは太字ではなく色やサイズでテキストの強弱をつけたほうがいいですよ。

関連エントリー

Androidの画面キャプチャを撮る
Androidブラウザでviewportのwidth指定
Androidの「target-densitydpi」でviewportの調整
Android エミュレータでサイト制作
HTML5が使えるスマートフォンOS

スポンサードリンク

«6月11日に金沢でセミナー出演します! | メイン | [ASCII.jp]いまから始める、jQuery Mobileの基本»