Stylishを使ってみる

インストールが完了すると、Stylishのアイコンがステータスバーに登録される(図3)。

図3 ステータスバーに登録されたStylishのアイコン

このアイコンをクリックするとメニューが表示される(図4)。

図4 Stylishのメニュー

ごくごくシンプルなものである。さてここで、現在、表示中のマイコミジャーナルの表示を変更してみる。メニューの[スタイルを書く]→[mycom.co.jp用]を選択する。URLは現在表示中のページのURLが自動的に設定されている。[スタイルの追加]ダイアログが表示される(図5)。

図5 スタイルを追加ダイアログ

ここで、「@-moz-document url("http://journal.mycom.co.jp") {」と「}」の間に、変更したいCSSのコードを記述していくのである。実際には、ソースコードの該当部分のセレクタを確認し、それに合わせたスタイルを記述すればよい。ここでは、安易であるが、文字などの表示を青にしてみる。

* {
   color: blue !important;
  }

図5のダイアログで、[概要]にはどのような変更かを記述する(図6)。

図6 スタイルを追加した状態