リンクに関するタグ
リンクする
A href
<A href="アドレス" target="ウィンドウ指定">表示する文字</A>
例
<A href="http://www.art-pla.net/hh/" target="_parent">ホームページ作成無料レクチャー「HH」</A>
↓
ホームページ作成無料レクチャー「HH」
ウィンドウ指定の種類
target="_blank" 新しくウィンドウを開く
target="_parent" 親となる一つ上のウィンドウに開く（フレーム使用の場合など）
target="_self" 現在と同じウィンドウで開く
target="_top" もっとも親となるウィンドウに開く （基本）
リンクの説明文を表示する
title
<A href="アドレス" target="ウィンドウ指定" title="説明文">表示する文字</A>
例（リンクにカーソルを合わせると説明文を表示します）
<A href="http://www.art-pla.net/hh/" target="_parent"
title="ホームページ作成">ホームページ作成無料レクチャー「HH」</A>
↓
ホームページ作成無料レクチャー「HH」
リンクの文字色を変える
link vidited active hover
*ボディータグでの指定
<BODY link="色指定" vlink="色指定" alink="色指定">
*スタイルシートでの指定 <HEAD></HEAD>内に記述
<STYLE type="text/css">
<!--
A:link { color : 色指定 }
A:visited { color : 色指定 }
A:active { color : 色指定 }
A:hover { color : 色指定 }
-->
</STYLE>
link →未リンク（まだ訪れていないリンク）色
visited →リンク済（訪問済みリンク）色
active →リンク中（直前に訪問してリンク中）色
hover →マウスが上にあるリンク
リンクの背景色を変える
background-color
*スタイルシートでの指定 <HEAD></HEAD>内に記述
<STYLE type="text/css">
<!--
A:link { background-color: 色指定 }
A:visited { background-color: 色指定 }
A:active { background-color: 色指定 }
A:hover { color : 色指定 ; background-color: 色指定 ; text-decoration: none }
-->
</STYLE>
*↓この部分だけリンク色を変更（DIVに適用）
リンクの下線を消す
text-decoration: none
*スタイルシートでの指定 <HEAD></HEAD>内に記述
<STYLE type="text/css">
<!--
A:link { text-decoration: none }
A:visited { text-decoration: none }
A:active { text-decoration: none }
A:hover { text-decoration: none }
-->
</STYLE>
*↓この部分だけリンク色を変更（DIVに適用）
リンクに関する指定を複数行う
;
*複数の指定を行う場合は、指定内容を「 ; 」でつなぎます。
*スタイルシートでの指定 <HEAD></HEAD>内に記述
<STYLE type="text/css">
<!--
A:hover { color : 色指定 ; background-color: 色指定 ; text-decoration: none }
-->
</STYLE>
リンクのスタイルを部分的に変える
id
*部分的に変更したいリンクが入っているテーブルやレイアウトコンテナにスタイルシートを「id」で指定します。
*スタイルシートでの指定 <HEAD></HEAD>内に記述
<STYLE type="text/css">
<!--
#任意の名前 A:link { color : 色指定; }
#任意の名前 A:visited { color : 色指定; }
#任意の名前 A:active { color : 色指定; }
#任意の名前 A:hover { color : 色指定; }
-->
</STYLE>
*レイアウトコンテナ(DIV)へのid指定
<DIV id=" 上で指定した名前"><A href=" アドレス" target=" ウィンドウタ指定"> 表示する文字</A></DIV> <TABLE id=" 上で指定した名前"><TR><TD><A href=" アドレス" target=" ウィンドウ指定"> 表示する文字</A></TD></TR></TABLE>
*指定例
<STYLE type="text/css">
<!--
#links3 A:link { color : #ff00ff; }
#links3 A:visited { color : #666666; }
#links3 A:active { color : #0066ff; }
#links3 A:hover { color : #ff0000; }
-->
</STYLE>
*↓このページのデフォルトリンク色
*↓この部分だけリンク色を変更（DIVに適用）
|
