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

解決済

質問者：kingfruits
質問日時：2008/12/24 19:16
回答数：5件

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ベストアンサー

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

ならば・・・

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

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

- 0
- 件

通報する

この回答へのお礼

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>

通報する

お礼日時：2008/12/26 22:34

No.4

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

あの、いえ、class指定してみたら？　と言ったのですが……＾＾；

すみません、クラス指定というものをご存じなかったようですね。

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

- 0
- 件

通報する

この回答へのお礼

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>

通報する

お礼日時：2008/12/26 14:58

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>

補足日時：2008/12/25 21:54

通報する

- 0
- 件

通報する

No.2

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

img { border-width: 0px; }

コレだけで充分です。

この回答への補足

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

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

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

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

補足日時：2008/12/25 12:19

通報する

- 0
- 件

通報する

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を各タグの中に記述するのはイヤでして。

補足日時：2008/12/25 12:10

通報する