スタイルシートで動きをつける(1)
以下のように同じフォルダ内にtest.cssとtest.htmというファイルを作ります。
ファイル名:test.css
A:link { color: #0000FF; }
A:visited { color: #00FF00; }
A:active { color: #FF00000; }
A:hover { color: #FFFFFF; background-color:#000000}
|
【説明】
A:link・・・訪問されていないリンク→colorを#0000FFにする。
A:visited・・・訪問済みのリンク→colorを#00FF00にする。
A:active・・・読み出し中のリンク→colorを#FF0000にする。
A:hover・・・マウスがリンクの上にきた時→colorを#000000に、background-colorを#ccccccにする。
ファイル名:test.htm
<html>
<head>
<link rel="stylesheet" type="text/css" href="test.css">
<body>
<A>リンクのテストです。</A>
</body>
</html>
|
ページ内に多少動きがでてきます。
サンプル
関連リンク
スタイルシートとは
スタイルシートの作り方
スタイルシートで使用できる属性
スタイルシートで複数の属性を設定する
スタイルシートでクラスを設定する
スタイルシートで動きをつける(2)
スポンサードリンク
| |