[CSS]リンクの情報をサポートするスタイルシートのテクニック集
Post on:2009年3月17日
ファイルタイプごとにアイコンを変更したり、外部リンク・訪問済みリンクのスタイリングなど、リンクの情報をサポートするスタイルシートのテクニックをDesigner Dairy Newsから紹介します。
![デモのキャプチャ](/wp-content/uploads-2009/2009031701-01.png)
Add File Type Icons next to your links with CSS
リンクしているファイルのタイプごとにアイコンを表示。
![デモのキャプチャ](/wp-content/uploads-2009/2009031701-02.png)
Using CSS 3 selectors to apply link icons
リンク先の言語ごとにアイコンを表示。
![デモのキャプチャ](/wp-content/uploads-2009/2009031701-03.png)
Highlight Microformats with CSS
マイクロフォーマットの箇所をハイライト表示。
![デモのキャプチャ](/wp-content/uploads-2009/2009031701-04.png)
Simple, accessible external links
CSSオフ時にも配慮した、外部リンクの表記。
![デモのキャプチャ](/wp-content/uploads-2009/2009031701-05.png)
Easy CSS Tooltip
スクリプト無しで、スタイルシートで実装するツールチップ。
![デモのキャプチャ](/wp-content/uploads-2009/2009031701-06.png)
The ways to style visited links
訪問済みのリンクをスタイリング。
![デモのキャプチャ](/wp-content/uploads-2009/2009031701-07.png)
Optimize Your Links For Print Using CSS — Show The URL
印刷時にリンク先を表示。
![デモのキャプチャ](/wp-content/uploads-2009/2009031701-08.png)
CSS image replacement for submit buttons
buttonを画像に置換。
sponsors