Herramientas para desarrolladores
Las hojas de estilo EffCSS y sus creadores asociados se pueden consultar mediante la extensión especial para navegador EffCSS Developer Tools.
Instalación
El método de instalación depende del navegador:
- En Mozilla Firefox, se puede usar la extensión desde su tienda de complementos.
- En navegadores basados en Chromium (como Google Chrome, Yandex Browser, Microsoft Edge, etc.), se puede instalar manualmente desde un archivo ZIP usando
chrome://extensions.
Interfaz
La extensión permite inspeccionar las hojas de estilo creadas con EffCSS. Puedes ordenarlas, filtrarlas por estado activo, buscar contenido CSS e inspeccionar la configuración específica (tanto el creador como la hoja de estilo).
El espacio de trabajo consta de dos partes: una lista y una tarjeta.
El área de lista ofrece las siguientes acciones:
- Seleccionar el marco que se desea inspeccionar (si hay varios marcos con EffCSS).
- Mostrar el proveedor de estilo del marco actual en la consola del navegador.
- Recargar la extensión.
- Activar/desactivar todas las hojas de estilo EffCSS para el marco actual.
- Buscar contenido CSS o clave del creador.
- Seleccionar la propiedad de ordenación.
- Seleccionar la dirección de ordenación.
- Filtrar las hojas de estilo activas/pasivas.
- Seleccionar todas las hojas de estilo o restablecer la selección.
- Mostrar las hojas de estilo seleccionadas en la consola del navegador.
- Guardar el CSS de las hojas de estilo seleccionadas.
- Guardar el JavaScript de los creadores de hojas de estilo seleccionados.
- Activar las hojas de estilo seleccionadas.
- Desactivar las hojas de estilo seleccionadas.
- Agregar o eliminar hojas de estilo de la selección.
- Mostrar la hoja de estilo en la consola del navegador.
- Abrir la tarjeta de la hoja de estilo.
- Activar/desactivar la hoja de estilo.
El área de la lista también permite comparar hojas de estilo utilizando varios contadores, como reglas, propiedades, etc. Para ver el contenido CSS o el creador relacionado, debe abrir la tarjeta de la hoja de estilo.
El área de la tarjeta ofrece las siguientes acciones:
- Abrir la pestaña del creador.
- Abrir la pestaña de la hoja de estilo.=
- Cerrar la tarjeta.