css - quitar - ¿Cómo eliminar el borde(contorno) alrededor de los cuadros de texto/entrada?(Chrome)
quitar focus input css (11)
Conjunto
input:focus{
outline: 0 none;
}
"! importante" es por si acaso. Eso no es necesario. [Y ahora se ha ido. –Ed.]
Esta pregunta ya tiene una respuesta aquí:
¿Alguien puede explicar cómo quitar el borde naranja o azul (contorno) alrededor de los cuadros de texto / entrada? Creo que solo ocurre en Chrome para mostrar que el cuadro de entrada está activo. Aquí está la entrada CSS que estoy usando:
input {
background-color: transparent;
border: 0px solid;
height: 20px;
width: 160px;
color: #CCC;
}
Descubrí que también puedes usar:
input:focus{
border: transparent;
}
Este borde se usa para mostrar que el elemento está enfocado (es decir, puede escribir la entrada o presionar el botón con Entrar). Puede eliminarlo, sin embargo:
textarea:focus, input:focus{
outline: none;
}
Es posible que desee agregar alguna otra forma para que los usuarios sepan qué elemento tiene el enfoque del teclado, sin embargo, para facilitar su uso.
Chrome también aplicará el resaltado a otros elementos, como los DIV utilizados como modales. Para evitar que se resalte en esos y en todos los demás elementos, puedes hacer:
*:focus {
outline: none;
}
Esto definitivamente funcionará. El contorno naranja no se mostrará más ... Común para todas las etiquetas:
*:focus {
outline: none;
}
Específico para alguna etiqueta, ej: etiqueta de entrada
input:focus {
outline:none;
}
He encontrado la solución.
Utilicé: outline:none;
En el CSS y parece haber funcionado. De todas formas, gracias por la ayuda. :)
La respuesta actual no me funcionó con Bootstrap 3.1.1. Esto es lo que tuve que anular:
.form-control:focus {
border-color: inherit;
-webkit-box-shadow: none;
box-shadow: none;
}
Utilice la siguiente sintaxis para eliminar el borde del cuadro de texto y eliminar el borde resaltado del estilo del navegador.
input {
background-color:transparent;
border: 0px solid;
height:30px;
width:260px;
}
input:focus {
outline:none;
}
esto elimina el marco naranja en cromo de todos y cualquier elemento sin importar qué y dónde esté
*:focus {
outline: none;
}
Solución
*:focus {
outline: 0;
}
PD: Usa outline:0
lugar de outline:none
enfocado. Es válida y mejor práctica.
<input style="border:none" >
Funciono bien para mi Deseaba tenerlo arreglado en el propio html ... :)
input:focus {
outline:none;
}
Esto lo hara. El contorno naranja ya no aparecerá.