HTMLの骨組みが見える、デバッグ用CSS

* { outline: 2px solid rgba(255, 0, 0, 0.1) !important; }

あまり実用的でないかもしれませんが、かっこよかったのでポスト。

RGBAを使って色を指定しているので、重なっているところはより濃く見えます[1]

全称セレクタをやめれば、特定の部位にだけ線を引くこともできます。

YOUR-ELEMENT { outline: 2px solid rgba(255, 0, 0, 0.1) !important; }
  1. IE6で見ても何も起こりませんのであしからず…

10/6, 2010 | Lang: CSS| Tags: , | Author: tomohiro_kasuga