下記のタグをコピーして<head>と</head>の間に入れます。
黄色の部分(#色)を自分の好きな色に変えて下さい。
<style type="text/css">
<!--
a:link {
text-decoration:none;
color:#ff6a00;
}
a:visited {
text-decoration:none;
color:#ff6a00;
}
a:active {
text-decoration:none;
color:#ff6a00;
}
a:hover {
text-decoration:none;
color:#ff6a00;
border:solid 1px #ff6a00;
}
-->
</style>
<a href="リンク先url">ここへリンク文字やリンク画像</a>
a:hover {
text-decoration:none;
background-color:#ccccff; /*背景色*/
color:#333333;
border:solid 1px #333333;
}
下線を出したくない場合は text-decoration: none;
下線を出したい場合は text-decoration: underline;
link | 未訪問のリンク |
---|---|
visited | 訪問済みリンク |
active | リンクをクリックしたとき |
hover | マウスが乗ったとき |
ターゲットtarget はリンク表示(リンクの開き方)の方法です。上記のソースは新しいウィンドウで開きます。
ターゲットの種類
target="_blank" | 新しいウィンドウで開きます |
---|---|
target なし | 同じページで開きます |
target="_top" | 全てのフレームを解除して画面全体を表示 |
target="_self" | 同じウィンドウ(フレーム)に表示 |
target="_parent" | 親フレームに表示します。 |
target="フレーム名" | フレームから別フレームに表示します |
●当サイトのソースは、IE6.0+のみ動作確認をしております。 それ以外のブラウザでは正しく作動しない場合がございます。ご了承下さい。