ちょっとした小技

こんな風になります

リンクページでよく見られるかもしれません。当サイトではちょっとやってませんが(汗)

<HTML>
<HEAD>

<STYLE TYPE="text/css">
A:link{
color:#000000;
text-decoration:none;}
A:active{
color:#000000;
text-decoration:none;}
A:visited{
color:#000000;
text-decoration:none;}
A:hover{
color:#ff6600;/*変更色*/
position : relative;
top:2px;　left:2px;/*凹量*/
text-decoration:none ;}
</STYLE>
</HEAD>
<BODY>
<DIV style="width : 90px;height : 16px;top : 14px;left : 7px;
position : absolute;
z-index : 1;
" id="Layer1"><a href="#"><IMG src="画像名前" width="横の長さ" height="縦の長さ" border="0"></a></DIV>

見本のタグは下記の通りです

<HTML>
<HEAD>

<STYLE TYPE="text/css">
A:link{
color:#000000;
text-decoration:none;}
A:active{
color:#000000;
text-decoration:none;}
A:visited{
color:#000000;
text-decoration:none;}
A:hover{
color:#ff0033;/*変更色*/
position : relative;
top:3px;　left:2px;/*凹量*/
text-decoration:none ;}
</STYLE>
</HEAD>
<BODY>
<DIV style="width : 90px;height : 16px;top : 14px;left : 7px;
position : absolute;
z-index : 1;
" id="Layer1"><a href="#"><IMG src="http://www.geocities.jp/crush_bottle/a008icn.gif" width="32" height="32" border="0"></a></DIV>

文字の場合は<IMG src=～border="0">部分を全部消して入れたい文字を入力します。

サンプル↓

こんな感じ

<a href="#">ここに文字を入れてください</a></DIV>

color の部分は自由に調節して下さい(color#ffccccとか#33cc33など)
また変更色も番号を入れれば色の変更が可能です。
凹量も自由に変更できますので、色々と使えます。(現在は２です)

画像を押すと凹む方法

見本のＨＴＭＬソースはこうなってます。
<IMG src="a009icn.gif" width="32" height="32" border="0" alt="こういう感じででますｖ">

当サイトのＴＯＰページやイラストページでお馴染みのものです。
カーソルを合わせると、黄色い背景の文字が出てくるやりかたです。

画像の上にカーソルを合わせると文字が出る方法

このページの壁紙はこうなってます。
<body background="hp-sakusei.gif" bgproperties="fixed">

背景停止、壁紙を動かさずに、本文だけ移動させる方法です。
このページが見本となってます。ちょっとわかりにくいかもしれませんが。

背景の停止方法