Font Link的なのをCSSでやる

/ PC / Chrome, css, note

いい加減Syncに失敗してBookmarkの並びが崩れるのにイライラしてきたので、仕方なくChrome（というかChomePlus）を更新したらgdi++使えなくなった。
gdippとかMacTypeは細かいところが微妙だったので素直にClearTypeでメイリオ使うことにした。
そのままだといろいろ気にくわないし、こだわりもあるけど、もうできるだけ環境依存的なことは辞めたい。

◆ 基本は「Arial+Meiryo UI」1がいい
◆ Winのせいで糞フォントと化しているヒラギノは他のフォントに置き換えたい2

これがChromeのCustom.cssで実装できるそうなので3、じゃあそうしましょうって感じ。

いろいろ悩んだけどこんな感じで落ち着いた。

フォントの設定

設定 - フォントとエンコード

Custom.css

@charset "UTF-8";

@font-face {
  font-family: 'メイリオ';
  src: local('Arial');
  unicode-range: U+0000-007F;
}

@font-face {
  font-family: 'Meiryo UI';
  src: local('Arial');
  unicode-range: U+0000-007F;
}

@font-face {
  font-family: 'ヒラギノ角ゴ Pro W3';
  src: local('メイリオ');
}

  1. Meiryo UIとかメイリオの英字は何か気持ち悪いので嫌い ↩

  2. え、普通Winにはヒラギノ入ってないって！？ ↩

  3. Google ChromeでＭＳ ＰゴシックをArial+メイリオに置換する – Weblog – hail2u.net ↩

関連記事