Firefoxのリンクで点線の輪郭を取り除くことはできませんか？ - CSS、ファイアウォール、概要、点線

私はimgsの完全なリストを持っています：

<ul>
<li><a href="#"><img src="/images/test.png" /></a</li>
<li><a href="#"><img src="/images/test.png" /></a</li>
<li><a href="#"><img src="/images/test.png" /></a</li>
(...)
</ul>

Firefoxでそれらをクリックすると、点線で囲まれたアウトラインが表示されます（だれがそれを発明したのか、そしてその理由は？非常に醜い！）。

それらを取り除きたいのですが、スタイルの「アウトライン」などはうまく動かないようですが、以下のすべてのオプションを試してみました。

#ul li img:active {
-moz-outline-style: none;
-moz-focus-inner-border: 0;
outline: none;
outline-style: none;
}

#ul li img:focus {
-moz-outline-style: none;
-moz-focus-inner-border: 0;
outline: none;
outline-style: none;
}

#ul li img a:active {
-moz-outline-style: none;
-moz-focus-inner-border: 0;
outline: none;
outline-style: none;
}

#ul li img a:focus {
-moz-outline-style: none;
-moz-focus-inner-border: 0;
outline: none;
outline-style: none;
}

回答：

にスタイルを適用する必要があります。 <a> タグ（後者の2つのCSSルールは間違っています。 <a> 内側のタグ <img>.

これは私のために働く：

a:active,
a:focus {
outline: none;
-moz-outline-style: none;
}

または、IDを持つ要素の中だけ ul （ところで、最高の名前ではありません）：

#ul a:active,
#ul a:focus {
outline: none;
-moz-outline-style: none;
}

a:active,
a:focus {
outline: none;
-moz-outline-style: none;
}

FF22で私のために働きます

アウトライン：0 それを実行する必要があります <a> 要素。実際には子ではない <img />. <img /> の子供です <a> だからあなたのCSSは読む必要があります：

#ul li a {
outline: 0;
}