html - data - collapse jquery
Cómo eliminar el contorno apareció al hacer clic en Bootstrap UI Accordion (7)
El esquema se agrega a la panel-heading panel-title <a> tag del panel-heading panel-title <a> tag , que tiene una clase .accordion-toggle . Entonces, para evitar el selector * catch-all puedes hacer esto:
.accordion-toggle:focus{outline: none;}
Con esta solución tampoco es necesario! Importante ( por lo que respetará a los desarrolladores que vienen después de usted ).
outline es una propiedad abreviada cuyo único valor requerido es outline-style . En este caso, estoy configurando outline-style en none .
Este es un gran artículo que explica la especificidad, si no está convencido de que debe evitarse, importante en todos menos en un par de casos.
Estoy tratando de usar el acordeón bootstrap angular-ui para mantener la tabla de bootstrap dentro del encabezado. Cuando el usuario hace clic en el encabezado del acordeón y se abre, aparece un contorno extraño. Se ve así (el rectángulo azul claro alrededor de "Some title"):
Entiendo que sucede porque usé <div> , pero ¿cómo puedo eliminar este comportamiento?
El código es:
<accordion close-others="true">
<accordion-group>
<accordion-heading>
<div>Some title</div>
</accordion-heading>
Text
</accordion-group>
<accordion-group>
<accordion-heading>
<div>Another title</div>
</accordion-heading>
</accordion-group>
</accordion>
El trabajo 100% será:
a:focus, a:hover {
color: #23527c;
text-decoration: none;
}
intente agregar una clase dentro del título div como:
<div class="title-div">
luego en css, intente con:
.title-div:focus {outline: 0 !important;}
prueba esto
.accordion-heading:focus{outline:0;border:none;}
prueba esto:
.accordion-toggle:hover, .accordion-toggle:focus, .accordion-toggle:active{
text-decoration: none;
outline-style: none;
}
Prueba esto funciono para mi
.ng-scope .accordion-toggle { outline: 0 !important;}