Firefox などの CSS3 を使ってローカルなリンクに別の色を付ける

ローカルなリンクと外部へのリンクを区別したい場合、Firefox など CSS3 を使えるブラウザ相手には、次のようにすれば良い。

a:link[href^="file:"] { color: lime; } a:link:not([href*=":"]) { color: green; } a:visited[href^="file:"] { color: olive; } a:visited:not([href*=":"]) { color: olive; }

ちなみにこのサイトではだいたい次のように設定している。

a:link { color: #cc3333; } a:visited { color: darkred;} a:active { color: #ffcc33;} a:hover { color: #ffcc33;} a:link:not([href^="http://jrf.cocolog-nifty.com/"]) { color: blue; } a:link:not([href*=":"]) { color: #990000; } a:visited:not([href^="http://jrf.cocolog-nifty.com/"]) { color: purple; } a:visited:not([href*=":"]) { color: darkred; } a:active:not([href^="http://jrf.cocolog-nifty.com/"]) { color: #ffcc33; } a:active:not([href*=":"]) { color: #ffcc33; } a:hover:not([href^="http://jrf.cocolog-nifty.com/"]) { color: #ffcc33; } a:hover:not([href*=":"]) { color: #ffcc33; }

参考
	《userContent.css と userChrome.css で Firefox のカスタマイズ》

更新：	05/05/07,06/02/16
初公開：	2006年02月16日 03:58:17
最新版：	2006年03月01日 14:16:33