解決済
サムネイル画像のリンク罫線とマウスオーバー罫線の消し方
スタイルシートで、リンク先に下線を、マウスオーバーで点線下線に変化する様に設定しています。サムネイル画像には、 BORDER="1"で周囲罫線を設定してあります。
このサムネイル画像の周囲には、常に黒の周囲罫線だけとしたいのですが、他のリンク先と同様に罫線がリンク済みの色（紫）に変わったり、マウスオーバーで点線下線が入ります。
text-decoration: none;をスタイルシートや、htmlソースのリンクや画像の箇所に入れてみましたが、罫線が変化してしまいます。
サムネイル画像の周囲の罫線を変化させない様にするには、どうしたら良いでしょうか？
宜しくお願いいたします。
サムネイル画像のタグです。
<TABLE CLASS="sozi1">
<TR>
<TD><A HREF="sozai-image/t02.jpg" TARGET="_blank"><IMG SRC="sozai-image/t01.jpg" WIDTH="80" HEIGHT="80" BORDER="1"></A></TD>
<TD></TD>
</TR>
<TR><TD COLSPAN="2">はてな君</TD></TR>
<TR><TD COLSPAN="2">【縦】245KB</TD></TR>
</TABLE>
回答(1)
1.
CSS（追加）：
a.test{
text-decoration: none;
border:0px;
}
a.test:hover{
text-decoration: none;
border:0px;
}
a img{
border:1px solid black;
}
HTML（修正）：・・・ <A class="test" HREF="sozai-image/t02.jpg" TARGET="_blank"> <img・・・この例だと、aタグにtestというクラスを指定して、CSSでその内容を決めています。クラスを指定しないテキストの方は、以前のままのスタイルで、testクラスを指定したところだけは、上のスタイルが適用されます。ちなみに、a imgは毎回borderを指定する必要がないようにつけておきました。
オニキスさん ありがとうございました。
ずっと苦戦していましたが、ばっちりできました。
tableではなく、aにクラス指定するのですね。また、 a imgのこの様な使い方も知りませんでした。スタイルシートは奥が深いので、まだまだ勉強しないといけません。
大変、勉強になりました。
コメント(10)
コメントありがとうございます。
周囲罫線がないと、バックの白と同じで四角がわからなる写真があります。また、BORDER="0" にしましても、マウスオーバーで点線の下線が出てしまいます。それらを改善したいのです。
>BORDER="0" にしましても、マウスオーバーで点線の下線が出てしまいますありゃま(> <)
これはもはや初心者である私が口を出せる話ではないですね＾＾；
誰か詳しい人がこれを見て回答してくれると良いのだけれど。
現在はこの様になっています。
table.sozi1 {
text-decoration: none;
font-size: x-small;
}
外部スタイルシートです。
リンク関係は下記の様になっています。
a {
text-decoration: none;
color: #0000E0;
border-style: solid;
border-width: 0px;
border-bottom-width: 1px;
}
A:hover {
text-decoration: none;
color: #8080FF;
border-style: dotted;
border-width: 0px;
border-bottom-width: 1px;
}
A:visited {
color: #800080;
}
okapyonさん、解決おめでとうございます＾＾
昨日は私のとんちんかんな補足要求(＃４)にすぐに応えていただきありがとうございました。
>tableではなく、aにクラス指定するのですね。また、 a imgのこの様な使い方も知りませんでした>>1 の内容はまだ半分も理解できていないのですが・・・私もとても勉強になります。
万年床生活者（謹慎中）さん
いろいろコメントありがとうございました。
コメントのお陰でソースをアップして解決となりました。
最初から、もう少しソースを記載すべきと反省です。
今後とも宜しくお願いします。
>>#8
私は普段はまったくの役立たずなのですが
今回は少しはお役に立てたようで嬉しいです。
回答したオニキスさんも喜んでいることでしょう。
質問の仕方は全く問題ないですよ。説明も丁寧でわかりやすいです。
こちらこそ、今後ともよろしくお願いします(^^)
ベストありがとうございます＾＾
万年床生活者（謹慎中）さんのご紹介で回答させて頂きました。
