Usuwanie kropkowane obramowanie po kliknięciu

Question

Używam tego CSS do usunięcia granic przerywanych, które pojawiają się, gdy hiperłącza są kliknięciu

a:active, a:focus, input { 
    outline: 0; 
    outline-style:none; 
    outline-width:0; 
} 

to działa dobrze, ale nie działa na guziki wejściowych, które mają obrazy tła.

Answer 1

To nie moje miejsce na kwestionowanie decyzji projektowych, więc proszę bardzo.

Wystarczy dodać do tego jakiś związek, do którego chcesz usunąć linia przerywana

onfocus="if(this.blur)this.blur()" 

Answer 2

To nie działa dobrze. Uniemożliwia poruszanie się po projekcie bez użycia myszy.

Zobacz http://24ways.org/2009/dont-lose-your-focus za rozsądny kompromis.

Answer 3

Można dodać onclick: blur();, dzięki czemu będzie on zachowywał kartę i nie zrujnuje projektu po kliknięciu.

Ale dla rekordu wygląda na to, że działa w przeglądarce. Pierwsza część dla IE, drugi dla FF:

input, input:active, input:focus{ 
    outline: 0; 
    outline-style:none; 
    outline-width:0; 
} 

button::-moz-focus-inner, 
input[type="reset"]::-moz-focus-inner, 
input[type="button"]::-moz-focus-inner, 
input[type="submit"]::-moz-focus-inner, 
input[type="file"] > input[type="button"]::-moz-focus-inner { 
    border: none; 
} 

Answer 4

Trzeba odróżnić klas, które linki mają granic przerywane, a które nie. Używanie selektora img nie wystarczy.

Oznacz znaczniki wejściowe tak, aby nie zawierały przerywanych obramowań; możesz nawet użyć klasy dla przycisków wejściowych, jeśli masz więcej niż jeden styl (Wyczyść, Prześlij, Anuluj itd.)