Gmailで等幅フォント表示：テキストとHTMLの使いわけもOK

Posted at 03:44 on May 18, 2009

Last updated at 02:07 on July 21, 2010

Category: News, Note

Tags: Firefox, Google, Web, ツール, パソコン, ライフハック, 仕事, 勉強

※ 追記しました。

» ライフハック・便利ツール紹介野郎: Gmail本文を等幅フォントで：テキストとHTMLの使いわけ問題もクリア

以前、「Gmail本文を等幅フォントで表示する方法：Firefoxアドオン『Stylish』で」という記事を書いて、Gmail 本文を等幅フォントで表示するスタイル「Gmail Fixed-width Font」を作ってみましたが、HTML メッセージまで等幅になってしまうという問題が残っていました。

ですが、このたびバージョンアップしまして、テキストメッセージ＝等幅フォント、HTML メッセージ＝プロポーショナルフォントとすることができました！

Firefox アドオンの Stylish を使うことで、JavaScript（Greasemonkey）をまったく使わずに Gmail の等幅フォント表示が可能になりました。

■ ソース

@namespace url(http://www.w3.org/1999/xhtml);

@-moz-document domain("mail.google.com") {
  div.ii {
    font-family: monospace !important;
    font-size: 12px !important;
  }
  div.ii div {
    font-family: sans-serif !important;
    font-size: 12px !important;
  }
}

「Gmailを等幅フォント表示に（2009年3月～）」という記事でご紹介したようにこれまでは Greasemonkey を使っていましたが、Stylish に乗り換えることにします！

※ 追記（May 18, 2009）

新規メール作成のときにテキストエリアも等幅フォントにしないといけないのに、すっかり忘れていました。

ということで、追記しました。

■ ソース
@namespace url(http://www.w3.org/1999/xhtml);

@-moz-document domain("mail.google.com") {
  div.ii, textarea.dV {
    font-family: monospace !important;
    font-size: 12px !important;
  }
  div.ii div {
    font-family: sans-serif !important;
    font-size: 12px !important;
  }
}

※ さらに追記（June 12, 2009）

» ライフハック・便利ツール紹介野郎: Gmail本文を等幅フォント表示：引用部分がプロポーショナルになる問題を解決

テキストメッセージであっても引用部（“>”の付いた部分）が等幅フォントで表示されないという問題があることに気付きました。

書き直したソースは以下です。どうぞご自由にお持ちください。

■ ソース

@namespace url(http://www.w3.org/1999/xhtml);

@-moz-document domain("mail.google.com") {
  div.ii, textarea.dV {
    font-family: monospace !important;
    font-size: 12px !important;
  }
  div.ii p, div.ii li, div.ii table {
    font-family: sans-serif !important;
    font-size: 12px !important;
  }
}

▲上に戻る▲