CSS rimuovere il bordo blu predefinito

Ho un modulo con più pulsanti in cui utilizzo un JavaScript per inviare il secondo pulsante quando qualcuno preme Invio.CSS rimuovere il bordo blu predefinito

Questo funziona benissimo ma se apro questo modulo in IE il primo pulsante ottiene un bordo blu che indica all'utente "questo è il pulsante che verrà premuto quando si preme invio".

C'è un modo per rimuoverlo con CSS senza sovrascrivere il resto dello stile del pulsante?

default button style

Esempio:

<button onclick="javascript:alert('remove');">Remove name</button>

fonte

2013-05-20 Peter

qualche immagine o il codice sarebbe bello – samayo

@phpNoOb c'è un'immagine (il pulsante), ha aggiunto un po 'di codice .. – Peter

non sta mostrando il bordo blu nel mio IE8 – samayo

di questo codice:

button { border:0;}

fonte

2013-05-20 11:40:35

Beh certo rimosso il bordo blu, ma convertito i pulsanti alle scatole ... – Peter

C'è un modo per avere il proprio bordo personalizzato, ma non quel confine interno blu? Posso solo sbarazzarsi di entrambi o nessuno ... – thomthom

Questo può aiutare. Utilizzare i seguenti proprietà CSS:

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

fonte

2013-05-20 11:58:07

Questo rimosse la linea tratteggiata (che volevo mantenere), ma non rimosse il problema del bordo blu ... – Peter

Per favore provate questo. spero che ti possa aiutare. input {background: none transparent; confine: nessuno; } For Demo Visita questo link: http: //jsfiddle.net/dEvKb/64/ –

mi dispiace ma questo rimuove lo stile predefinito dai pulsanti ("esiste un modo per rimuoverlo con css senza sovrascrivere l'intero stile del pulsante?") – Peter

-2

Basta aggiungere border-radius per sviluppare l'aspetto tasto:

-moz-border-radius:7px; 
-webkit-border-radius:7px; 
border-radius:7px;

fonte

2013-05-20 12:05:35

Questo cambia anche il layout, una domanda in realtà provi le cose che pubblichi o stai solo indovinando? – Peter

Sto programmando da 5 anni. Se crei un nuovo problema nel modo di risolvere altri, puoi incolpare le tue stesse abilità, non altri che ti hanno dato l'idea di risolvere il tuo problema. –

@TouhidRahman Una raccomandazione, per favore non prenderla come un reato, ma tieni presente che se la tua risposta non si adatta ai requisiti OP, o se la tua risposta sembra semplice, probabilmente dovresti ottenere un voto negativo. Se ritieni che sia impossibile ottenere esattamente ciò che l'OP vuole, ti preghiamo di spiegare perché non è possibile (o semplicemente di dire "non è possibile"), e poi dare la tua alternativa, così l'OP può vedere almeno che hai provato. In altri casi sembra che tu voglia solo essere la pistola più veloce;) – Arkana

-1

button{border:none; border-radius:4px; -moz-border-radius:4px;}

fonte

2013-05-20 12:06:20

di questo codice:

button { 
    border : 0px; 
    -moz-border-radius:7px; 
    -webkit-border-radius:7px; 
    border-radius:7px; 
}

fonte

2013-05-20 19:04:32

Voglio solo rimuovere il bordo blu (attivo) non il normale bordo ... – Peter

che questo dovrebbe funzionare (solo testato IE10 su PC) per il confine:

button { outline: 0; }

Vuoi rimuovere lo sfondo (necessario su WebKit/Blink)?

Add:

background: none;

bisogno di sbarazzarsi del confine (rimuove background su IE10 troppo):

border: 0;

fonte

2013-08-23 09:40:57

'button {outline: 0;}' ha fatto il trucco in Chrome. Avevo già rimosso lo sfondo e il bordo, ma c'era ancora un bordo blu quando ho fatto clic sul pulsante in Chrome. –

questa è la risposta giusta dovresti dare credito all'autore selezionandolo come risposta. – samuelkobe

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

Questo risolto il problema se chiunque visite altro il post. Ho aggiunto i miei stili separatamente, in quanto in realtà non sono al centro della questione.

fonte

2014-02-11 20:55:22 crazyjedi98

la mia soluzione (dopo pochi mesi)

button:focus { 
outline: 0; 
box-shadow: none; 
}

fonte

2014-03-12 14:12:41

CSS rimuovere il bordo blu predefinito

risposta

Problemi correlati