Ver: estado de desplazamiento en Chrome Developer Tools
Quiero ver el :hoverestilo de un ancla sobre la que estoy flotando en Chrome . En Firebug , hay un menú desplegable de estilos que me permite seleccionar diferentes estados para un elemento.
Parece que no puedo encontrar nada similar en Chrome. ¿Me estoy perdiendo de algo?
Ahora puedes ver las reglas de pseudoclase y aplicarlas a los elementos.
Para ver las reglas como :hoveren el panel Estilos, haga clic en el :hovtexto pequeño en la parte superior derecha.
Para forzar un elemento a entrar en :hoverestado, haga clic derecho sobre él y seleccione :hover.
Consejos adicionales sobre el panel de elementos en Atajos de herramientas para desarrolladores de Chrome .
Esto fue un poco complicado, pero aquí va:
- Haga clic derecho en el elemento, pero NO aleje el puntero del mouse del elemento
; mantenga el mouse en estado flotante . - Elija Inspeccionar mediante el teclado: presione la flecha hacia arriba ( 🠅) y luego la tecla Intro ( ↵).
- Si es necesario, utilice la flecha arriba/abajo para encontrar el elemento HTML correcto en las herramientas de desarrollo.
- Busque en las herramientas de desarrollador en Reglas/Estilos coincidentes.
El selector CSS superior debe ser de:hovertipo.
Quería ver el estado de desplazamiento en la información sobre herramientas de Bootstrap. Forzar el :hoverestado en las herramientas de desarrollo de Chrome no creó el resultado requerido, pero activar el mouseenterevento a través de la consola funcionó en Chrome. Si jQuery existe en la página, puede ejecutar:
$('.YOUR-TOOL-TIP-CLASS').trigger('mouseenter');
Hay varias formas de ver los estilos HOVER STATE en Chrome Developer Tools.
Método 01
Método 02
Con el peaje predeterminado para desarrolladores de Firefox
Con Firebug
