knowledge base

マークアップ/フロントエンドエンジニアのWEB制作における備忘録です。平日はWEB屋、休日は社会人劇団の主宰・劇作家をしています。

IE8で明朝体の表示が崩れる

明朝体にするとき、最も簡単なフォント指定は次のとおりです。

font-family: serif;

これでほとんどのブラウザでは明朝体になるのですが、IE8だけ表示が崩れてしまいます。下図の赤枠で囲った文字がその顕著な例です。

f:id:ShinImae:20160107214023j:plain

「青」がゴシック体になっているし、「飾」も明朝体ではあるものの見慣れない字体になっています。
調べたところ、どうやらIE8はきちんとフォント名まで記述しないといけないようです。

font-family: 'MS P明朝', 'MS PMincho', serif;

これで狙い通りのフォントで表示することができます。