Post Type: textPost Date: 2011/05/11
前のPostで書いたCSSのフォントのなんぞをちょっとアレしたやつを書く。ブラウザによって表示が異なるアレね。
http://stystk.com/test/chrome-safari-font.html
まぁ↑のdemoにある通りなんだけど、SafariとChromeでフォント表示が違う。
FirefoxとChromeはWin/Mac共に上が明朝で下がゴシック体表示になった。Mac版Safariは上がゴシック体で下が明朝体。Win版Safariは上下共ゴシック体。OperaはWin/Mac共に上下とも明朝体。IE8は上下ともゴシック体。IE9は互換モードだと上下ともゴシック体、標準モードだと上明朝体で下ゴシック体。(thx @sabotenbrother)
GoogleWebFontsのVollkornを読み込んでる。上のが{font-family:Vollkorn,serif;}、下のが{font-family:Georgia,sans-serif;}。
Mac版SafariはWebFontsを使った場合(上の場合)、そのフォント内にない文字(この場合和文)を表示する場合はserif指定とか無視して、ヒラギノが強制的に使われるのかな。で、Mac版SafariはGeorgiaを指定している場合の和文は、sans-serif指定を無視してヒラギノ明朝が強制的に使われるようになってるのかな。
あとでもうちょっと調べてみようと思う。→とりあえずザーっといろんなブラウザでチェックした。あとはCSSの仕様とかか…面倒くさいな…というか仕様にあるのかな…チェックした限り、割とバラバラだし…
なんとなく、FirefoxとChromeの表示が正しいような気はしてる。
正しさとは何かね。君の言う正しさとは。
実例: Twitterのtweet表示のページとか、 http://hail2u.net/404.html とか。