SmallStyle

_ CSS のデバッグの小技

新しいスタイルシートを書いたりするときは，たいていデバッグ用にボーダーを入れたりなんかしたりするのですが，これを構造を階層ごとに色分けして表示すると，よりデバッグしやすくなるかも．そんな小技が A Handy CSS Debugging Snippet で，デバッグ用の CSS が紹介されていました．

ためしにこのサイトでも表示させてみたのですが，うーん，どうだろう．スタイルシートを定義する初期段階では結構役立ちそうな気もします．

リンク先では，CSS に記述してコメントアウトしておいて，構造を確認したいときにコメントをはずしてるよ，って書いてたけど，自分の場合は，それをやるとうっかり忘れて放置とかはずかしいことをしてしまいそうなので，Bookmarklet にしてみたり．

javascript:(function(){var newSS, styles='* { outline: 2px dotted red } * * { outline: 2px dotted green } * * * { outline: 2px dotted orange } * * * * { outline: 2px dotted blue } * * * * * { outline: 1px solid red } * * * * * * { outline: 1px solid green } * * * * * * * { outline: 1px solid orange } * * * * * * * * { outline: 1px solid blue }'; if(document.createStyleSheet) { document.createStyleSheet(%22javascript:'%22+styles+%22'%22); } else { newSS=document.createElement('link'); newSS.rel='stylesheet'; newSS.href='data:text/css,'+escape(styles); document.documentElement.childNodes[0].appendChild(newSS); } })();

_ 飲み会

金曜はお客さんと飲み会…というか，接待っていうのかな？久々に定時に会社を出たような気がするなぁ．家に着いたら 22 時過ぎで，いつもはまだ会社にいる時間．

0 時前には就寝して，朝の 7 時前に，朝日を浴びて起床…と書くと，さわやかな感じがするが，実際はアルコールの分解に水分を使ったためか，のどは渇くは，直射日光直撃で暑くて目が覚めたという最悪な状態なのでした．

_ GIGAZINE のロゴを小さくする CSS

GIGAZINEのロゴを小さくするGreasemonkey を見て，Firefox ユーザーで Stylish を使ってる人は CSS でロゴを小さくしたりもできますよ，という話．

GIGAZINE はサイトを訪れるといつもあの大きなロゴが「ばーん」と目に入ってくるのですが，慣れてしまうとちょっと邪魔に思えてしまったり…（いや，サイトの看板みたいなもんだから目立つのは当然なのですが…）

そんなわけで，私の場合は下記の CSS でロゴを小さく表示しています，

@namespace url(http://www.w3.org/1999/xhtml);
@-moz-document domain("gigazine.net") {
  img[src*="logo.png"] {
   width: 100px;
  }
}

Stylish を使ってなくても，userContent.css でも可能です．