現在の位置
ココは何? 編集
userContent.cssを使って、ウェブ上の広告をカットすることができますが、そのまとめのページです。以下のリンク先を読むと参考になるかもしれません。また、DOMインスペクタがサイトの構造、製作者CSSを調べるのにとても役立ちます。是非使いましょう。
- CSS 2 セレクタ リファレンス

- W3C Working Draft CSS3 Selectors(英語)

- CSS3のモジュール:テキスト(邦訳)

- Firefox 1.5でのCSSスタイル指定向上

- CSSメモ: Firefox 1.5での新機能

拡張Adblockとの違い 編集
userContent.cssはいわゆるユーザースタイルシートです。スタイルシート(CSS)とはHTML文書の表示を指定するファイルのことです。ユーザースタイルシートとはウェブ製作者が指定しているCSSに対してユーザー側からCSSを指定して、ユーザーがウェブの表示を変更できる仕組みです。つまり、サイトの外観を自分好みに変えることが出来ます。例えば、文字サイズが小さい、配色が見辛い、横幅が狭く固定されている、など自分好みでない部分を一度自分が読みやすいようにCSSを書いて変更すれば、以後訪れるたびに文字サイズを変更したりせずに済みます。Firefoxではサイト別に指定することが出来るので、かなり自由にいじれます。
基本的にはAdblockよりも自由度が高く、広告の親要素ごとカットしたり、テキスト広告もカット出来ます。しかし表示上は消えてもダウンロード自体は行われます。通常の広告カットはAdblock、それだけでは消えないような要素をCSSで消すなど、使い分けるといいかもしれません。
なお、Adblockとは違い再起動しないと変更が適用されません。再起動せずにCSSの編集がしたい場合は、JavaScript::Bookmarklet
の「スタイルをテスト」というブックマークレットを使うか、 EditCSS(サイドバーでCSSを編集する拡張)やWeb Developer(ウェブ開発者向けの多機能拡張)を使うとよいでしょう。
広告カット例 編集
/* テキスト広告 */
a[href*="firefox.geckodev.org"] {
display: none !important;
}
/* サイズが指定された広告をカットする */
[src][width="468"][height="60"] {
display: none !important;
}
/* ID が指定されている広告をカットする */
#advertisement1 {
display: none !important;
}
この書式が何を意味するかの詳細はW3C Working Draft CSS3 Selectors
(日本語
)をご覧ください。FirefoxはCSS2も結構サポートしていますので(CSS3も一部、独自拡張などで適用可)適用の自由度は高いと言えます。デザインが崩れることがありましたら、display:none;の部分をvisibility:hidden;に書き換えてください。
さて、これより詳細に広告をカットする方法は「Firefox Help 広告をブロックする
」にあります。
特定のドメインやURLのみ対象にする 編集
- 特定のドメインを対象にする。(" ")内を便宜書き換えてください。
- URLの先頭文字列が一致するサイトを対象にする。
- 特定のページを対象にする。
@-moz-document domain("DOMAIN") { /* ここにスタイルを記述します */ } @-moz-document url-prefix("URL") { /* ここにスタイルを記述します */ } @-moz-document url("URL") { /* ここにスタイルを記述します */ }