html - 開いている青い境界線を削除Chromeの要素？

Question

アクセシビリティを向上させるために、新しい HTML5details要素を使用するようにサイトをアップグレードしています。

すべて問題なく動作していますが、残念ながら要素をクリックして開くと、Chrome は醜い青い境界線を適用します。

Chromeがこれを行うのを止める方法はありますか? 明示的な CSS スタイルが適用されているのがわからないので、それを取り除く方法がわかりません。

問題をデモするための JSFiddle コード: http://jsfiddle.net/6x2Kc/

Answer 1

使用するoutline:none;

例えば、

summary{
  outline:none;
}

ワーキングデモ

お役に立てれば。

Answer 2

アウトラインを使用: 0;

summary:focus {
     outline: 0;
}