非Windows環境で、AAをずれずに表示する方法

読了まで:約1分


概要: @font-face で MS P Gothic を Monapo に置換する


超個人的メモ。

前提

Linux とか、Mac とかの非 Windows 環境では、2ch とかでよく使われるアスキーアートがずれる。 で、Windows メインは AA 使用サイトとかでは、フォントの指定に MS P Gothic を使ってたりする。

で、今回は、これをずれないようにしたい。

方法の概要

CSS3(だっけ?)の@font-faceを使って、MS P Gothic に指定されているフォントの指定を置換する。

事前準備

今回は、AA 対応フォントとして、

を使います。なので、各自 Monapo をインスコすること。

あと、この後書く方法は、他のフォントでも応用可なので、 自分の好み AA 対応フォントを使うことも可能

実際のユーザースタイルシート

ざっとこんな感じ。ちなみに下記は Google Chrome の Stylish で使用しているもの。 多分だけど、他の CSS3 をサポートしていて、かつユーザースタイルシートが使えるものだったら、 このスタイルシートが利用できると思う。

@charset "UTF-8";
@font-face {
font-family: "MS Pゴシック";
src: local("Monapo");
}
@font-face {
font-family: "MS PGothic";
src: local("Monapo");
}

解説とか詳細

何をやってるか、っていうと、このスタイルシートでは、

  1. MS P Gothic というフォント名をフォントの指定に使った場合に
  2. Monapo というフォントを使う

という設定を行っています。

まあ、あれだ、@font-faceについては詳しくないので、 このプロパティに関する詳細は各自検索してください。

あと、@charset "UTF-8"とありますが、これはフォント名の指定の部分に、日本語を使っている為、 必要となります。なおエンコーディングについては各自の環境に合わせてください。

それと、今回は置換先のフォント名に Monapo を指定していますが、 もし他のフォントを使いたい場合には、その使いたいフォントのフォント名をMonapoの代わりに使えば、 多分 OK だと思います。

以上

メモは終わり。

#FIXME

にゃるら(カラクリスタ)

『輝かしい青春』なんて失かった人。
次に備えて待機中。

今は趣味でプログラミングをして
生活しています。