今度はWindowsのGoogle Chromeの表示フォントをアンチエイリアスのフォントにしたくなった。
だってfont-family: '英数字フォント名';って設定しているウェブページの日本語文字が、Windowsで当該英数字フォントにフォントリンクされているMS Pゴシック等で表示されてしまうから(上図参照)。
そこで、Google ChromeでMS PゴシックをArial+メイリオに置換する - Weblog - hail2u.netを参考に、以下のユーザスタイルシート(ユーザCSS)を作成してみた。
@charset 'UTF-8';
@font-face { font-family: 'MS Pゴシック'; src: local('ARISAKA-AA'); }
@font-face { font-family: 'MS PGothic'; src: local('ARISAKA-AA'); }
@font-face { font-family: 'MS UI Gothic'; src: local('Microsoft Sans Serif'); unicode-range: U+0000-007F; }
@font-face { font-family: 'MS UI Gothic'; src: local('ARISAKA'); unicode-range: U+0080-10FFFF; }
@font-face { font-family: 'Arial'; src: local('Arial'); unicode-range: U+0000-007F; }
@font-face { font-family: 'Arial'; src: local('ARISAKA'); unicode-range: U+0080-10FFFF; }
@font-face { font-family: 'Arial Black'; src: local('Arial Black'); unicode-range: U+0000-007F; }
@font-face { font-family: 'Arial Black'; src: local('HGP創英角ゴシックUB'); unicode-range: U+0080-10FFFF; }
@font-face { font-family: 'Helvetica'; src: local('Microsoft Sans Serif'); unicode-range: U+0000-007F; }
@font-face { font-family: 'Helvetica'; src: local('ARISAKA'); unicode-range: U+0080-10FFFF; }
@font-face { font-family: 'Helvetica Black'; src: local('Arial Black'); unicode-range: U+0000-007F; }
@font-face { font-family: 'Helvetica Black'; src: local('HGP創英角ゴシックUB'); unicode-range: U+0080-10FFFF; }
@font-face { font-family: 'Tahoma'; src: local('Tahoma'); unicode-range: U+0000-007F; }
@font-face { font-family: 'Tahoma'; src: local('ARISAKA'); unicode-range: U+0080-10FFFF; }
@font-face { font-family: 'Trebuchet'; src: local('Trebuchet MS'); unicode-range: U+0000-007F; }
@font-face { font-family: 'Trebuchet'; src: local('ARISAKA'); unicode-range: U+0080-10FFFF; }
@font-face { font-family: 'Trebuchet MS'; src: local('Trebuchet MS'); unicode-range: U+0000-007F; }
@font-face { font-family: 'Trebuchet MS'; src: local('ARISAKA'); unicode-range: U+0080-10FFFF; }
@font-face { font-family: 'Verdana'; src: local('Verdana'); unicode-range: U+0000-007F; }
@font-face { font-family: 'Verdana'; src: local('ARISAKA'); unicode-range: U+0080-10FFFF; }
@font-face { font-family: 'MS P明朝'; src: local('Times New Roman'); unicode-range: U+0000-007F; }
@font-face { font-family: 'MS P明朝'; src: local('HGP明朝E'); unicode-range: U+0080-10FFFF; }
@font-face { font-family: 'MS PMincho'; src: local('Times New Roman'); unicode-range: U+0000-007F; }
@font-face { font-family: 'MS PMincho'; src: local('HGP明朝E'); unicode-range: U+0080-10FFFF; }
@font-face { font-family: 'Times'; src: local('Times New Roman'); unicode-range: U+0000-007F; }
@font-face { font-family: 'Times'; src: local('HGP明朝E'); unicode-range: U+0080-10FFFF; }
@font-face { font-family: 'Times New Roman'; src: local('Times New Roman'); unicode-range: U+0000-007F; }
@font-face { font-family: 'Times New Roman'; src: local('HGP明朝E'); unicode-range: U+0080-10FFFF; }
@font-face { font-family: 'MS ゴシック'; src: local('ARISAKA-等幅'); }
@font-face { font-family: 'MS Gothic'; src: local('ARISAKA-等幅'); }
@font-face { font-family: 'Andale Mono'; src: local('ARISAKA-等幅'); }
@font-face { font-family: 'MS 明朝'; src: local('HG明朝E'); }
@font-face { font-family: 'MS Mincho'; src: local('HG明朝E'); }
@font-face { font-family: 'Courier'; src: local('HG明朝E'); }
@font-face { font-family: 'Courier New'; src: local('HG明朝E'); }
@font-face { font-family: 'Comic Sans'; src: local('Comic Sans MS'); unicode-range: U+0000-007F; }
@font-face { font-family: 'Comic Sans'; src: local('HG丸ゴシックM-PRO'); unicode-range: U+0080-10FFFF; }
@font-face { font-family: 'Comic Sans MS'; src: local('Comic Sans MS'); unicode-range: U+0000-007F; }
@font-face { font-family: 'Comic Sans MS'; src: local('HG丸ゴシックM-PRO'); unicode-range: U+0080-10FFFF; }
@font-face { font-family: 'Impact'; src: local('Impact'); unicode-range: U+0000-007F; }
@font-face { font-family: 'Impact'; src: local('HGP創英角ポップ体'); unicode-range: U+0080-10FFFF; }
button { font-family: 'Microsoft Sans Serif', 'ARISAKA', sans-serif; }
ユーザCSSって%USERPROFILE%\Local Settings\Application Data\Chromium\User Data\Default\User StyleSheets\Custom.cssの事で、今回はUTF-8で保存している。
今回もARISAKA等のフォントに置換する例だが、個人的にはここまでやるやつぁ馬鹿だと思う。
念のため上図と同じサンプルHTMLを下に掲載するけど、あなたのウェブブラウザではどう表示される?
- font-family: 'Arial';
- 012abcABC新しい朝が来た希望の朝だ
- font-family: 'Arial Black';
- 012abcABC新しい朝が来た希望の朝だ
- font-family: 'Helvetica';
- 012abcABC新しい朝が来た希望の朝だ
- font-family: 'Helvetica Black';
- 012abcABC新しい朝が来た希望の朝だ
- font-family: 'Tahoma';
- 012abcABC新しい朝が来た希望の朝だ
- font-family: 'Trebuchet';
- 012abcABC新しい朝が来た希望の朝だ
- font-family: 'Trebuchet MS';
- 012abcABC新しい朝が来た希望の朝だ
- font-family: 'Verdana';
- 012abcABC新しい朝が来た希望の朝だ
- font-family: 'Times';
- 012abcABC新しい朝が来た希望の朝だ
- font-family: 'Times New Roman';
- 012abcABC新しい朝が来た希望の朝だ
- font-family: 'Andale Mono';
- 012abcABC新しい朝が来た希望の朝だ
- font-family: 'Courier';
- 012abcABC新しい朝が来た希望の朝だ
- font-family: 'Courier New';
- 012abcABC新しい朝が来た希望の朝だ
- font-family: 'Comic Sans';
- 012abcABC新しい朝が来た希望の朝だ
- font-family: 'Comic Sans MS';
- 012abcABC新しい朝が来た希望の朝だ
- font-family: 'Impact';
- 012abcABC新しい朝が来た希望の朝だ