Firefox での印刷時の背景色

Firefox (Iceweasel) で、背景色を白以外(薄い灰色)に指定して使用している。プリンタへの印刷の際には「背景色を印刷しない」設定ができる。そのはずなのだが、しばらく前からこれが印刷されるようになってしまっていた。

検索してみて、もじら組フォーラムから Bug 652914 という情報にたどり着いた。いまだ解決されていないようだ。背景色を白以外に設定していて、かつ、プリンタに印刷することのある人というのはかなり少数なのだろうか。

自分の userContent.css に

@media print {
        * {background-color: white;}
}

と書いたら、とりあえず背景色は印刷されなくなった。この程度で回避できるくらいなら、すぐにも修正されそうな気もするのだが。

MediaWikiのスタイルシート

編集の際、プレビューはするものの最後に保存するのを忘れてしまい、せっかくの編集が水泡に帰すことがしばしばある。そこでせめてプレビューのあいだは背景に色を着けて注意を促したい。

全ての外装に反映されるスタイルは MediaWiki:Common.css に書けばいいらしい。編集画面でプレビューは <div id=’wikiPreview’> となっているので、

div#wikiPreview {
background-color: #ACCAC1;
}

のように書いた。

検索窓

WordPress を使っているサイトを見てまわると、サイドバーに記事の検索を行なうための窓があることがしばしばある。単語を入力する窓はあっても submit のボタンがないこともあり、ああそれでもいいんだっけなどと思っていた。

「検索」ボタンがなくフォームだけがポッカリ開いていると、それが何を意味しているのかわからないので、そのフォームに「Search…」などと表示させておきたい。しかも単語を入力するときにはその表示を消したい、と思って調べたのでメモしておく。

見つけたこの例の type=”search” は Mac の Safari 限定なので普通は type=”text” にする。ついでに文字の色を変化させる。

<input type="text" name="s" id="s" onfocus="if(this.value=='(検索)'){this.className='word'; this.value='';}" onblur="if(this.value==''){this.className='prompt'; this.value='(検索)';}" class="prompt" value="(検索)" />

文字の色はスタイルシートで、入力される検索語をクラス word で、「(検索)」と表示させるときをクラス prompt で、

input.prompt { /* 入力を促す Search... など(フォーカスすると消える)の色 */
	color: #999999;
}
input.word { /* 検索語の色 */
	color: #000000;
}

のように指定する。