<BODY>〜</BODY>の3回目ですが、今回はリンク(アンカー)に色をつける方法です。この場合のリンクとは主にテキストのリンクです。
前回の講座でも説明したようにリンクに関連する属性は3つあります。
<BODY
LINK="#000000"> |
リンク(アンカー)のテキストの色 |
<BODY
ALINK="#000000"> |
リンクをクリックした瞬間のテキストの色 |
<BODY
VLINK="#000000"> |
すでに訪問したページへのリンクのテキストの色 |
"#000000"は#の次から2桁ごとに赤・青・黄の割合を表わします。
一般的にあるページから別のページに飛ぶための下のような青い下線がついている文章やボタンのことをリンクといっています。
リンクされてないリンク見本
ただ、リンクは状態であって目印はアンカーだという説もあります。
これはホームページとWEBページのようなもので、たとえ通称であってもそのほうがよく伝わるときにはそちらを使った方がいいと思います。今後はリンクと表記します。
ただ、この後で説明するALINKやVLINKの元の意味を考えればリンク自体が目印を表わしていることも否定できないでしょう。(どうでもいいことですが)
<BODY LINK="#000000">はリンクの色を指定するものです。
先の例のようにリンクは標準として青色のテキストに下線がついたものが使われますが上のようにLINK属性を変えることによってその色を変更することができます。
ただし青以外を使うと見る人が先入観から単なる強調したテキストと勘違いする恐れは否めません。使うときはそれを承知の上でお使いください。
次のリンクは通常時に赤、クリック時に黄色、既訪問時に緑色になります。
このページへのリンク
次の例のように前回講座のTEXT属性と合わせて使うこともできます。
例 <BODY
LINK="#55FFDC">〜</BODY>
<BODY LINK="fuchsia">〜</BODY>
<BODY TEXT="blue"
LINK="fuchsia">〜</BODY>
<BODY ALINK="#000000">はリンクをクリックしたときの色を指定するものです。厳密にはリンクをクリックした瞬間からデータを読み込んでいる途中の色です。ALINKはActive Linkの略のようです。
指定しているページの方が少ないですし、クリックした直後に画面が消去され別のページに飛ぶことが多いのでそういった状態を見たことのない人も多いのではないでしょうか。
間違えないでください。以前に読み込んだページへのリンクの色が変わっていることはよくありますが、これは次に説明するVLINK(Visited
Link)で指定した色であってALINKで指定した色ではありません。
先の「このページへのリンク」のところをクリックしてみてください。最初赤のリンクがクリックした瞬間に黄色になり、ジャンプした後では緑色に変わるはずです。(このページへ飛びますので再読み込みになります。)
もちろん例のようにLINK属性やVLINK属性と合わせて使うこともできます。
例
<BODY TEXT="blue" LINK="fuchsia"
ALINK="red" VLINK="darkgray">〜</BODY>
<BODY VLINK="#000000">は先に説明してしまいましたが既に訪問したページへのリンクの場合に通常の色と変えることによって既に訪問したことの目印となります。Visited
Linkの略のようです。
ただし、ブラウザのオプションで履歴の情報を消すとすべてのVLINKがクリアされLINK属性で指定の色もしくは指定のないときはデフォルト色である青色に戻ってしまいますのでご注意を。
もちろん例のようにLINKT属性やVLINK属性と合わせて使うこともできます。
例
<BODY TEXT="blue" LINK="fuchsia"
ALINK="red" VLINK="darkgray">〜</BODY>
パソコンを利用しているとよくデフォルト(default)という言葉を聞きますが、これは不履行、怠慢の意味です。
つまり、指定できるところで指定しない場合にソフト側であたえられる既定の値や色などをデフォルト値とか、デフォルト色などといっています。
構 文
<HTML>
<HEAD>
<TITLE>
</TITLE>
</HEAD>
<BODY
LINK="リンク色"
ALINK="クリックの瞬間色" VLINK="訪問済リンク色">
ここに本文を書く。
</BODY>
</HTML>
使用例
<HTML>
<HEAD>
</HEAD>
<!--BODYタグによりリンクに関する色を設定-->
<BODY TEXT="BLUE" LINK="RED"
ALINK="YELLOW" VLINK="BROWN">
<A HREF="ここにリンク先のページを指定 ">指定したページへのリンク</A>
</BODY>
</HTML>
<!--と-->で囲んだ部分はコメントとして扱われブラウザ上には表示されません。
なお、上の文中でリンク先のページを指定せずにこのまま実行した場合には「指定したファイルが見つかりません」などというエラーが出ますのでご注意ください。
詳細はいずれ<A HREF="">〜</A>の回で説明します。
|