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; }

<b>参考</b>
  《userContent.css と userChrome.css で Firefox のカスタマイズ》
  
更新：05/05/07,06/02/16
初公開：2006年02月16日 03:58:17
最新版：2006年03月01日 14:16:33

Trackbacks:

《Firefoxのネタ》 from ネタ蔵
Firefoxのネタを追いかけるヨ！ 

受信： 2006-02-16 06:23:07 (JST)

Links:

Firefox: http://www.mozilla-japan.org/ (hbm)
CSS3: http://www.w3.org/Style/CSS/current-work (hbm)
userContent.css と userChrome.css で Firefox のカスタマイズ: http://memo.xight.org/2006-02-07-3 (hbm)