ＭＥＮＵへ 元のページに戻る

リンク部分にマウスが乗ったら色を変える！( <style>〜</style>タグ )

■ Step 1 <style>〜</style>タグを記述する。


リンク（<A>〜</A> タグ）の表示に関するスタイルシートを<style>〜</style>タグの間に記述します。
なお、<style>〜</style>タグは、<HEAD>〜</HEAD>タグの間に記述します。 
<HTML>
<HEAD>
  <TITLE>リンク部分にマウスが乗ったら色を変える！ ( <style>〜</style>タグ )</TITLE>
　<style TYPE="text/css">
　<!--
  　A {TEXT-DECORATION: none}
  　A:hover {COLOR: yellow; BACKGROUND-COLOR: blue; TEXT-DECORATION: underline}
　-->
　</style>
</HEAD>
<BODY>
　　・・・・・・
</BODY>
</HTML>

■ Step 2 スタイルシートの設定で、リンク（ <A>〜</A> タグ）を使う。


リンクの表示に関するスタイルシートを一括して<style>〜</style>タグで記述してある設定は、<A>>〜</A>タグを使用するたび適用される。 
<HTML>
　<HEAD> 
　　・・・・
　</HEAD>
　<BODY>
　テストです。→「<A href="hptec_00.htm">目次へ戻る</A>｣<BR>
　</BODY> 
</HTML> 

［実行結果］
　テストです。→「目次へ戻る｣
Top へ