外部スタイルシートでリンクについて
- 0 名前： らら ： 2005/02/13 02:32
- 始めまして、スタイルシートで悩んでるので、アドバイスお願いします。
外部スタイルシートでリンクの設定をする時ですが、
A:link {text-decoration:none;color:#D55500;}
A:visited {text-decoration:none;color:#fd790d;}
A:active {text-decoration:none;color:#fd790d;}
A:hover {text-decoration:none;color:#d55500;position:relative;top:1;left:1;}
↑この設定はこのままで、画像のリンクだけhoverのpositionを無効にしたいのですが
どうすればいいのでしょうか？
よろしくお願いします。
- 1 名前： 寝太郎 ： 2005/02/13 18:00
- こんにちは。
えじさん、回答者の皆さん､いつもお世話になっております。
/*.nomove A:link {text-decoration:none;color:#fd790d;}
.nomove A:visited{text-decoration:none;color:#fd790d;}
.nomove A:active{text-decoration:none;color:#fd790d;}*/
.nomove A:hover{text-decoration:none;color:#d55500;position:relative;top:0px;left:0px;}
<div class="nomove">
<a href="../**.html"><img src="image/**.gif" width="20" height="63" border="0">
</a>
</div>
/*h3 A:link {text-decoration:none;color:#fd790d;}
h3 A:visited{text-decoration:none;color:#fd790d;}
h3 A:active{text-decoration:none;color:#fd790d;}*/
h3 A:hover{text-decoration:none;color:#d55500;position:relative;top:0px;left:0px;}
<h3><a href="../**.html"><img src="image/**.gif" width="20" height="63" border="0"></a></h3>
<a>タブを<div>か<h3>タブなどの親ボックスで囲み、a:hoverの「position:relative;top:0px;left:0px;」を
明示的にそれぞれ0pxと指定してやると、画像のリンクは揺れなかったです。
A:hover{text-decoration:none;color:#d55500;}だけだと、なぜか
だめでした。
Homepage Builderのプレヴューで確認しただけですｗ。はずしてましたら
ごめんなさいね。
詳しくはありませんので､ご参考程度になさってください。
- 2 名前： むむりく ： 2005/02/13 22:41
- 無理やりな解決法思いついた。
a { text-decoration: none; }
a:link { color: #d55500; }
a:visited { color: #fd790d; }
a:hover {
color: #d55500;
position: relative;
top: 1px;
left: 1px;
}
a:active { color: #fd790d; }
a:hover img {
position: relative;
top: -1px;
left: -1px;
}
- 3 名前： らら ： 2005/02/14 04:14
- ありがとうございました。
試してみた結果、成功です。
ホントお世話になりました。ｍ（＿＿）ｍ
