【ＣＳＳ】<a><image /></a>リンクでイメージの時だけアウトラインを消したい

質問

【ＣＳＳ】<a><image /></a>リンクでイメージの時だけアウトラインを消したい

役に立った：0件

質問者：kingfruits
投稿日時：2008/12/24 19:16
困り度：

htmlで<a></a>の中に<img />があるときだけアウトラインを消したいです。<a></a>中がテキストの時はアウトラインをつけたいです。

以下の様な記述で実現は出来たのですが、styleの記述をhead部に移行したいです。どうし記述したら良いでしょうか？

<html>
<head>
<style>

</style>
</head>
<body>
<a style="outline: none" href="javascript:void(0);"><img src="http://www.goo.ne.jp/gooicon.ico" alt="" /></a><br> 
<a href="javascript:void(0);">test</a>　
</body>
</html>

この質問への回答は締め切られました。

回答(5件)

No.5ベストアンサー20pt

回答者：noname#100277
回答日時：2008/12/26 22:20

ならば・・・

img { border-width: 0px; }
a:link{ text-decoration:none; }

を別ファイルで外部にしてclassやidで該当箇所に適応させれば良いのでは？

通報する

この回答へのお礼

aidesさん　たびたびありがとうございます。
以下の様な記述でできました。

スッキリしました。

<html>
<head>
<style>

</style>
</head>
<body>
<a style="outline: none" href="javascript:void(0);"><img src="http://www.goo.ne.jp/gooicon.ico" alt="" /></a><br> 
<a href="javascript:void(0);">test</a>　
</body>
</html>

No.4ベストアンサー10pt

回答者：reverie013
回答日時：2008/12/26 10:43

あの、いえ、class指定してみたら？　と言ったのですが……＾＾；
すみません、クラス指定というものをご存じなかったようですね。

こちら
http://www.tagindex.com/stylesheet/basic/format2 …
を参考にしてみて下さい。

通報する

この回答へのお礼

reverie013さん　ご回答ありがとうございました。
以下の様にして出来ました。

<html>
<head>
<style>

</style>
</head>
<body>
<a class="outline" href="javascript:void(0);"><img src="http://www.goo.ne.jp/gooicon.ico" alt="" /></a><br> 
<a href="javascript:void(0);">test</a>　
</body>
</html>

No.3

回答者：reverie013
回答日時：2008/12/25 15:31

そのoutline:none;をクラス指定したらいいんじゃないんですか？

通報する

この回答への補足

reverie013さん　ご回答ありがとうございます。
以下の様に記述して試してみましたが、期待した結果は得られませんでした。<a></a>の方が優先されるのでしょうか。
head部だけの記述で実現ってのは無理なんですかね。

<html>
<head>
<style>

</style>
</head>
<body>
<a href="javascript:void(0);"><img src="http://www.goo.ne.jp/gooicon.ico" alt="" /></a><br> 
<a href="javascript:void(0);">test</a>　
</body>

質問者のみ：
この回答にお礼をつける

No.2

回答者：noname#100277
回答日時：2008/12/24 22:17

img { border-width: 0px; }

コレだけで充分です。

通報する

この回答への補足

ご回答ありがとうございます。

img { border-width: 0px; }と記述してみましたが、消えませんでした。

質問の仕方が不十分だったかもしれません。すみません。
消したいのは、クリック後に出る点線の外枠なんです。

imgの時だけ消して、テキストの時は消したくないのです。

質問者のみ：
この回答にお礼をつける

No.1

回答者：se-nabe
回答日時：2008/12/24 21:03

アウトライン？といいますのは下線のことですか？
それでしたら、
text-decoration: none;
でできませんか？

これをIDとかクラスで指定してやればできると思います。
--CSS--
#under-line {
text-decoration: none;
}

--HTML--
<a href="#" id="under-line">hogehoge</a>

通報する

この回答への補足

ご回答ありがとうございます。

質問の仕方が悪かったようです・・・

アウトラインと申したのは、リンクをクリックした後に残る点線の枠の事でして、下線のことではありません。

style="outline: none"で消せるのですが、
<a herf="hoge">test</a>の時は有効で、
<a herf="hoge"><imag src="hoge" alt="" /></a>の時に消したいのです。

質問で示したように、
<a style="outline: none" href="hoge">"><imag src="hoge" alt="" /></a>
と書けば、実現できるようですが、styleを各タグの中に記述するのはイヤでして。